hide/disable nav until iFrames are loaded

can someone provide some sample code that will hide navigation until all the iframes has been loaded? here's what my page look like for reference THANKS


<div class="tabArea" id="nav">
      <a class=tab href="javascript:nav('ResumeContactInfoDiv')">Contact Information</a>
                 <a class=tab href="javascript:nav('ResumeObjectiveSkillsDiv')">Objectives/Skills</a>
                 <a class=tab href="javascript:nav('ResumeEducationDiv')">Education</a>
                <a class=tab href="javascript:nav('ResumeWorkInfoDiv')">Work Experience</a>
                <a class=tab href="javascript:nav('ResumeViewResumeDiv')">View Resume</a>
</div><br>
<div id="ResumeViewResumeDiv">
      <IFRAME NAME="ResumeViewResume" id="ResumeViewResume" SRC="../resume/ViewResume.aspx" style="WIDTH: 100%; HEIGHT: 100%"
      align="top" frameBorder="no" width="100%"scrolling="no"></IFRAME>
</div>

<div id="ResumeContactInfoDiv" style="DISPLAY: none">
      <IFRAME NAME="ResumeContactInfo" id="ResumeContactInfo" SRC="../resume/ContactInfo.aspx" style="WIDTH: 100%; HEIGHT: 100%"
      align="top" frameBorder="no" width="100%" scrolling="no"></IFRAME>
</div>

<div id="ResumeObjectiveSkillsDiv" style="DISPLAY: none">
      <IFRAME NAME="ResumeObjectiveSkills" id="ResumeObjectiveSkills" SRC="../resume/ObjectiveSkills.aspx"
      style="WIDTH: 100%; HEIGHT: 100%" align="top" frameBorder="no" width="100%" scrolling="no"></IFRAME>
</div>

<div id="ResumeEducationDiv" style="DISPLAY: none">
      <IFRAME NAME="ResumeEducation" id="ResumeEducation" SRC="../resume/Education.aspx" style="WIDTH: 100%; HEIGHT: 100%"
      align="top" frameBorder="no" width="100%" scrolling="no"></IFRAME>
</div>

<div id="ResumeWorkInfoDiv" style="DISPLAY: none">
      <IFRAME NAME="ResumeWorkInfo" id="ResumeWorkInfo" SRC="../resume/WorkInfo.aspx" style="WIDTH: 100%; HEIGHT: 100%"
      align="top" frameBorder="no" width="100%" scrolling="no"></IFRAME>
</div>