PDA

View Full Version : Tabs Menu Help



swift17
07-31-2006, 05:06 PM
1) Script Title: Tabs Menu (Rollover)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/tabmouseover.htm

3) Describe problem: I am trying to use this script inside a <tr> row of a table. I've got all the links edited for my site. The two links that use the rollover menu are inside seperate <td> cells which is inside a seperate <tr> row. When I rollover those two links, nothing pops up in the <ilayer>. Is there anything I'm doing wrong here?

I am also trying to center the layer inside of the <tr> row. Any help on that?

jscheuer1
07-31-2006, 10:52 PM
Please post a link to the page on your site that contains the problematic script so we can check it out.

swift17
08-02-2006, 01:17 AM
Unfortunately, I am still constructing my website and haven't got hosting for it yet. Is there anyway you would accept me putting it in a zip file and emailing it to you? If so, I could do that. Thanks.

mburt
08-02-2006, 01:20 AM
Or, you could attach to a thread. (making it much easier on anyone else trying to help :))

swift17
08-02-2006, 01:28 AM
How would I go about attaching a file?

shobuz99
08-02-2006, 01:35 AM
How would I go about attaching a file?

just copy the script and post it in the context of your post.

I think anyone shold be able to read it and decipher what's going on..

Just my opinion..
Shobuz99

swift17
08-02-2006, 01:42 AM
<table cellspacing="5" cellpadding="5" width="850" height="50" bgcolor="#F0E68C">

<script language="JavaScript1.2">

/*
Tabs Menu (mouseover)- By Dynamic Drive
For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
This credit MUST stay intact for use
*/

var submenu=new Array()

//Set submenu contents. Expand as needed. For each content, make sure everything exists on ONE LINE. Otherwise, there will be JS errors.

submenu[0]='<font size="2" face="Arial Narrow"><b><a href="weddings.html">Weddings</a> | <a href="seniors.html">Seniors</a> | <a href="couples.html">Couples</a> | <a href="familykids.html">Family/Kids</a></b></font>'

submenu[1]='<font size="2" face="Arial Narrow"><b><a href="weddinginfo.html">Weddings</a> | <a href="seniorinfo.html">Seniors</a> | <a href="couplesinfo.html">Couples</a> | <a href="familykidsinfo.html">Family/Kids</a></b></font>'

//Set delay before submenu disappears after mouse moves out of it (in milliseconds)
var delay_hide=500

/////No need to edit beyond here

var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""

function showit(which){
clear_delayhide()
thecontent=(which==-1)? "" : submenu[which]
if (document.getElementById||document.all)
menuobj.innerHTML=thecontent
else if (document.layers){
menuobj.document.write(thecontent)
menuobj.document.close()
}
}

function resetit(e){
if (document.all&&!menuobj.contains(e.toElement))
delayhide=setTimeout("showit(-1)",delay_hide)
else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhide=setTimeout("showit(-1)",delay_hide)
}

function clear_delayhide(){
if (window.delayhide)
clearTimeout(delayhide)
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

</script>

<tr>
<td>

<div id="describe" style="background-color:#E6E6FF;width:400px;height:25px" onMouseover="clear_delayhide()" onMouseout="resetit(event)">
<ilayer width="400" height="25" name="dep1" bgColor="#FFFFFF">
<layer width="400" height="25" name="dep2">
</layer>
</ilayer>
</div>

</td>
</tr>


<tr>

<td width="200">
&nbsp;
</td>

<td width="10" align="center">

<font size="4" face="Arial Narrow">
<div class="nounderline">

<a href="home.html">Home</a>

</td>

<td width="10" align="center">

<font size="4" face="Arial Narrow">
<div class="nounderline">

<a href="galleries.html" onMouseover="showit(0)">
Galleries
</a>

</td>

<td width="10"align="center">

<font size="4" face="Arial Narrow">
<div class="nounderline">

<a href="pricing.html" onMouseover="showit(1)">
Pricing
</a>

</td>

<td width="10" align="center">

<font size="4" face="Arial Narrow">
<div class="nounderline">

<a href="contact.html">Contact</a>

</td>

<td width="430">
&nbsp;
</td>
</div>
</tr>

</table>


As you can see, I'm trying to put the code inside my bottom table. On the page, the box is to the left of the table row and the menu links are in the center of the next table row. I'm thinking about putting them to the left though since I couldn't get the rollover box centered. But right now, when I roll over the two menu links that use the scipt, the new links don't pop up. So will the html help you out on this? I sure hope so. Thanks guys.

jscheuer1
08-02-2006, 07:57 PM
You need to place the script after the table.