"Rollover" layers

>In DW3 I'm trying to link layers to rollover buttons on my homepage, >so 
>that when the mouse is moved across a link, both the rollover >image and a 
>hidden layer with a description of content appears.  >However, whatever I 
>try, the layer will wither not show, or shows >permanently after being 
>revealed, rather than disappear when the >mouse moves away.

>I'd be very grateful for a "walkthrough" if someone can be bothered >to 
>help.....

Hey,

     I just designed a page of my own like this.  It works great.  I got 
most of the information on how to do it from http://www.webmonkey.com, but 
I'll show you the scripts and code I used as well.  Since I'm using a web 
based mail carrier, I'll have to doctor my tags so they don't try to 
display.

First of all, you need a reveal function.  Here's my doctored version

<.SCRIPT>

<.!---------------------------

function reveal(genericSubObject)
{
   if (document.layers)
      {
	 visible = 'show';
         hidden = 'hide';
         subreferencer = document.layers[genericSubObject];
      }
   else if (document.all)
      {
         visible = 'visible';
         hidden = 'hidden';
         subreferencer = document.all(genericSubObject).style;
      }

   if (subreferencer.visibility == visible)
      {
          subreferencer.visibility = hidden;
      }
   else
      {
          subreferencer.visibility = visible;
      }
}

//---------------------->

<./SCRIPT>

You can also write an image swap routine, I did, and it works in IE, but not 
in Netscape, so I won't post it.  The above js code works for both browsers. 
  Now to call the imageswaps and layer reveals at the same time You need 
something like this:

<.A HREF="URLHERE.html"
OnMouseOver="reveal('LAYERNAME'); swapImage(img1, img2);"
OnMouseOut="reveal('LAYERNAME'); swapImage(img2,img1);">

<.IMG Src="img1.gif(jpg)" Name="NAMEYOUGIVE">

<./A>

Or, if you don't have your own swapImage function, you can do this:

preload the images with this jscode:

<.SCRIPT>

<.!----------------

img1= new Image();
img1.src= "img1.gif(jpg)"

img2= new Image();
img2.src= "img2.gif(jpg)"

//--------------->

<./SCRIPT>

<.A HREF="URLHERE.html"
OnMouseOver="reveal('LAYERNAME');
             document.NAMEYOUGIVE.src= img2.src;"
OnMouseOut="reveal('LAYERNAME');
            document.NAMEYOUGIVE.src= img1.src;">

<.IMG Src="img1.gif(jpg)" Name="NAMEYOUGIVE">

<./A>

Remember to take out all the periods from the tags, and replace all the 
capitalized parameters as well as replace the name of your images with those 
I used in the script and tags and you should be all set.  If you don't want 
the user to go anywhere (i.e., just swap the image and reveal the layer) 
then replace "URLHERE.html" with "#".  Also note, you'll have to have either 
DIVs or LAYERs named LAYERNAME.

(i.e. <.DIV Id="LAYERNAME">Type this text<./DIV> or
<.LAYER Name="LAYERNAME">Type this text<./LAYER>)

Hope this helps,

Dack

010001000101001101010000010001000101001101010000
1   <><       Dackral Phillips           <><   1
0       http://www.redrival.com/dack           0
0      http://www.auburn.edu/~phillds          1
0      e-mail: htmlhacker(at)hotmail.com          0
1               ICQ: 65506604                  1
0    CHRISTIANITY COMPUTERS LANGUAGE CHESS     0
010001000101001101010000010001000101001101010000

______________________________________________________
Get Your Private, Free Email at http://www.hotmail.com

HWG hwg-techniques mailing list archives, maintained by Webmasters @ IWA