[thelist] mouseovers with layers??

Paulette Neal-Allen pnealall at ci.thornton.co.us
Wed Feb 21 19:19:43 CST 2001


Adrian wrote:
>> Hi Gang,
>> is it practical or feasible to have layers connected to a mouseover.  I have
>> a client that saw on a site some mouseovers that were headings (as images)
>> that changed to a lots of more text (as image).  I could do this for him but
>> Ive told him that this is not a good thing?!  ( on his site they would be
>> big images)
>> So can it be done with layers.

And Karen replied:
> there is a dreamweaver script that can be used on mouseover and works in all
> browsers (incl N6).  its called 'tmt_selectLayer'.  you can get the
> dreamweaver extension at http://www.massimocorner.com/ or use the script
> manually. its used at www.securant.com 
> with this function, you can only select a layer, not hide it. In order to
> shut it or deselect it, select another layer.  You can use an empty/clear
> layer to make it appear as if all layers are off.

Not only is it possible, but it works relatively painlessly, given that you have to play browser compatibility games.  Now, I wouldn't hold our site up as any kind of an example of anything, but our mouseovers with the layers DO work, so for an example you can see http://www.cityofthornton.net.  When you mouse over those LOVELY buttons on the left, you get the navigation menus, courtesy of onmouseover/onmouseout events.

What you have to be careful of is that layers have different visibility syntax.  For example, given a first image id="id1" and the new image id="id2", for IE you would write:
<script language="JavaScript">
<!--
function showNewImg( ) {
  document.all.id1.style.visibility = "visible";
  document.all.id2.style.visibility = "hidden";
}
//-->
</script>

For layers you would access it totally differently, as well as using different attributes:

<script language="JavaScript">
<!--
function showNewImgWNN4x( ) {
  document.layers.id2.visibility = "show";
  document.layers.id1.visibility="hide";
}
//-->
</script>

Likewise, the syntax for a hidden layer is different:
<layer  id="id2" onmouseover="showNewImgWNN4x" visibility="hide">

I hope that wasn't too much information, I got really excited 'cause I knew the answer to a question and no one else had already said what I was going to say.

Paulette Neal-Allen





More information about the thelist mailing list