Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 236
  • Last Modified:

re: Tabnav - how do I lock the subnav?

Hi,
   I have a dhtml tabnav that I would like to lock the subnav layer. In other words, it currently displays the layer id="sc1".  When you rollover the other toptabs in the toplink layer, I don't want the sublayer to change.
Here is the code that I have so far:
*******************************************************
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="/css/new/base.css" title="SB base styles" />
<link rel="stylesheet" type="text/css" href="css/portal.css" title="" />
<script type="text/javascript">

/***********************************************
* DD Tab Menu II script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

//Set tab to intially be selected when page loads:
//[which tab (1=first tab), ID of tab content to display]:
var initialtab=[1, "sc1"]

//Turn menu into single level image tabs (completely hides 2nd level)?
var turntosingle=0 //0 for no (default), 1 for yes

//Disable hyperlinks in 1st level tab images?
var disabletablinks=0 //0 for no (default), 1 for yes


////////Stop editting////////////////

var previoustab=""

if (turntosingle==1)
document.write('<style type="text/css">\n#tabcontentcontainer{display: none;}\n</style>')

function expandcontent(cid, aobject){
if (disabletablinks==1)
aobject.onclick=new Function("return false")
if (document.getElementById && turntosingle==0){
highlighttab(aobject)
if (previoustab!="")
document.getElementById(previoustab).style.display="none"
document.getElementById(cid).style.display="block"
previoustab=cid
}
}

function highlighttab(aobject){
if (typeof tabobjlinks=="undefined")
collectddimagetabs()
cleartabs()
aobject.className="current"
}

function cleartabs() {
for (i=0; i<tabobjlinks.length; i++)
{
if (i!=initialtab[0]-1)
tabobjlinks[i].className=""
}
}

function collectddimagetabs(){
var tabobj=document.getElementById("ddimagetabs")
tabobjlinks=tabobj.getElementsByTagName("A")
}

function do_onload(){
collectddimagetabs()
expandcontent(initialtab[1], tabobjlinks[initialtab[0]-1])
}

if (window.addEventListener)
window.addEventListener("load", do_onload, false)
else if (window.attachEvent)
window.attachEvent("onload", do_onload)
else if (document.getElementById)
window.onload=do_onload
</script>
</head>
<body class="fclinx">
<!--#include virtual="/includes/01_pagetop_prospect3.inc"-->


<!-- Start CONTAINER -->
<div id="min780">

<!-- Start TOPLINK layer -->
<div id="backgroundline">
      <div id="ddimagetabs">
            <a href="#" onMouseover="expandcontent('sc1', this)" onmouseout="cleartabs()">Financial Consultant</a>
            <a href="#" onMouseover="expandcontent('sc2', this)" onmouseout="cleartabs()">Wealth Management</a>
            <div id="ddimagetabs2"><a href="products_services.html" class="longer" onMouseover="expandcontent('sc3', this)" onmouseout="cleartabs()">Research &amp; Commentaries</a></div>
            <a href="fee_based.html" onMouseover="expandcontent('sc4', this)" onmouseout="cleartabs()">Products &amp; Services</a>
            <a href="specialized_services.html" onMouseover="expandcontent('sc5', this)" onmouseout="cleartabs()">Site Features</a>
      </div>
</div>  
<!-- End TOPLINK layer -->

<!-- Start SUBLINK layer -->
<div id="tabcontentcontainer">
      <div id="sc1" class="tabcontent">
            <div id="submenu">
                  <a href="#" class="highlight">Working with a Financial Consultant</a>
                  <a href="#">Developing a Financial Plan</a>
                  <a href="#" class="end">Find a Financial Consultant</a>
            </div>
      </div>
      
      <div id="sc2" class="tabcontent">
            <div id="submenu">
                  <a href="#">Wealth Management Platform</a>
                  <a href="#">Under the Citigroup Umbrella</a>
                  <a href="#" class="end">The Smith Barney Advantage</a>
            </div>
      </div>
      
      <div id="sc3" class="tabcontent">
      
      </div>
      
      <div id="sc4" class="tabcontent">
            <div id="submenu">
                  <a href="#">Services</a>
                  <a href="#">Planning</a>
                  <a href="#">Products</a>
                  <a href="#" class="end">Managed Money</a>
            </div>
      </div>
      
      <div id="sc5" class="tabcontent">
            
      </div>
</div>
<!-- END SUBLINK layer -->



<!-- End CONTAINER div -->
</div>            

</body>
</html>

*******************************************************
Thanks,
-Ron.
0
ron4721
Asked:
ron4721
1 Solution
 
Michel PlungjanIT ExpertCommented:
Change the onMouseOver to onClick???

onClick="expandcontent('sc1', this); return false"
0
 
ron4721Author Commented:
Thanks much!
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now