hey javascripters I need your help

Mike Lane

Say I had this in the html:

<div id="navcontainer">
<ul id="navbar">
<li><a href="#">link1</a></li>
<li><a href="#">link2</a></li>
<li><a href="#">link3</a></li>
</ul>
</div>

<div class="swap"></div>

What I'd like to do is when I rollover the link1, link2, and link3 class in the lower div to change from swap to say swap1, swap2, or swap3 respectively. I'm pretty sure that it'll take an onmouseover / onmouseout event I just don't know how to access the swap class.

flyingdutchie

Mike Lane wrote:

Say I had this in the html:

<div id="navcontainer">
<ul id="navbar">
<li><a href="#">link1</a></li>
<li><a href="#">link2</a></li>
<li><a href="#">link3</a></li>
</ul>
</div>

<div class="swap"></div>

What I'd like to do is when I rollover the link1, link2, and link3 class in the lower div to change from swap to say swap1, swap2, or swap3 respectively. I'm pretty sure that it'll take an onmouseover / onmouseout event I just don't know how to access the swap class.

Here is an example:

<div id="navcontainer"> 
<ul id="navbar">
<li><a href="#" swapclass="swap1"
	 onmouseover="doMouseOver(this);"
	 onmouseout="doMouseOut(this);">
	link1</a></li>
<li><a href="#" swapclass="swap2" 
	 onmouseover="doMouseOver(this);"
	 onmouseout="doMouseOut(this);">
	link2</a></li>
<li><a href="#" swapclass="swap3" 
	 onmouseover="doMouseOver(this);"
	 onmouseout="doMouseOut(this);">
	link3</a></li>
</ul>
</div>
 
<div id="my_swap" class="swap"></div>

Then you have this javascript function:

function doMouseOver(pLinkElm) 
{
	var swapClass = pLinkElm.swapclass;
	// or var swapClass = pLinkElm.getAttribute("swapclass");
	document.getElementById("my_swap").className = swapClass;
}

For the onmouseout, you would call a similar function:

function doMouseOut(pLinkElm) 
{
	document.getElementById("my_swap").className = "swap";
}

That's it.:)

There may be syntax errors in the above scripts, but you'll get the idea :
Finally i get to be of some help for you, Mike. As thanks for all the help you've given me! <img src="https://us.v-cdn.net/6029383/emoji/thumb.gif&quot; border="0" alt="" >
-- Anton.

Mike Lane

Sweet thanks!

flyingdutchie

Mike Lane wrote:

Sweet thanks!

No problem! I'll be putting some more of my javascript on this forum later, some functions that may come in handy for styling galleries.

Mike Lane

flyingdutchie wrote:

No problem! I'll be putting some more of my javascript on this forum later, some functions that may come in handy for styling galleries.

We could always use a javascript sticky to go along with the CSS sticky.