Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

show - hide layers pop-up- menu

Status
Not open for further replies.

kedward

IS-IT--Management
Oct 30, 2000
3
US
Hi all,

I am trying to make a layer show when you mouse over a link, and allow you to choose other links from that layer, then onmouseout hide the layer. I got the show and hide layer working fine on the link. My problem is that the layer will not stay shown so that you can choose a link from whithin the shown layer. What am I doing wrong? And how can I make the layer stay shown until mouse out? tia.

Ken Edwards Ken Edwards
ken@meancode.com
BGSU Student Affairs Web Manager
 
Well there are 2 ways to solve this problem

1 :- move the mouseover from the code(it right now probebly in the a href tag right now) to the td tag of table that the link is in

problem -- works only in IE

2 :- Get a custom script like the one used in sabetv.com
these ones are downloadable for sites like or
regards Unicorn11
unicorn11@mailcity.com

[red]Luck is not chance, it's toil; fortune's expensive
smile is earned.[red]
 
I had this problem a couple of weeks ago and solved it using a timeline. I set an action in the timeline to hide the layer you are wanting to show. Then, on the mouseover link set a mouseover behaviour to show the layer and one to stop the timeline, and a mouseout behaviour to play the timeline. On each link in the layer add a mouseover behaviour to stop the timeline and a mouseout behaviour to goto the timeline and another one to play the timeline.

What happens is that as you mouseover your link, the layer is shown and the timeline is stopped (ie. it will not hide the layer). As you mouseout, if you do not mouseover the layer which has appeared, the timeline is played and the layer hides itself. Otherwise, as you mouseover the layer, the mouseover action to stop the timeline takes effect and the layer remains visible. Then, when you mouseout from any link in your layer (except back onto the original link), the timeline is also played and the layer is hidden.

I hope this makes sense! It sounds a bit long winded but I have used it and produced a great pop-up menu effect.
 
The problem with timeline is that
u will have to create 10 timelines for 5 links
i.e. 2 per link so

according to me would be unnessary code

but then if u implement a menu system it itself carries a lot of code

regards
Abhishek Unicorn11
unicorn11@mailcity.com

[red]Luck is not chance, it's toil; fortune's expensive
smile is earned.[red]
 
You do produce a fair amount of code but you only actually create one timeline which is referenced by each link. The amount of coding comes from the fact you have mouseover and mouseout codes for each link. In my case, the majority of the coding functions produced for the timeline I have saved as a separate .js file and then used <script src= etc. to reference it. This helps to reduce the amount of coding on each page and, as my menu appears on each page, the javascript file is cached when first accessed which actually helps with the sites performance.

one puzzling thing is that Dreamweaver produces a function called MM_Init_timeline whcih it will not allow me to save place into the .js file, instead, i have to have this piece of script on each of my pages. Any ideas?

 
Can you give sample code for the nav button including the timeline? Thanks, AMc

Should I stay or should I go? Thanks & Goodbye, Joe.
 

download their autohide layers extension

then all you do is add the behavior to the div tag

<DIV onmouseout=&quot;hidelayer()&quot;>

roughly

why do any more work then that?

<Signature>
Sometimes the Answer You Are LOOKING for can be FOUND BY SEARCHING THE FAQ'S @&%$*#!!!
</Signature>
 
&quot;why do any more work then that? &quot;

= give a man a fish...vs. teach a man to fish....



> need more info?
:: don't click HERE ::
 
Hello. I am having the same issue with &quot;toggling layers&quot; and I tried deecee's suggestion of &quot;projectseven's&quot; autohide function and I still can't get it to work.

I have a graphic that I am trying to trigger the layer with to &quot;show&quot; and it does that just fine. But I still can't get it to &quot;hide&quot; when I MOUSEOUT.

Another thing, Deecee...when you suggested to place the following:

<DIV onmouseout=&quot;hidelayer()&quot;>

Where exactly does that go in the example below...or am I looking to place it in the wrong place? Also, do I even need to place a &quot;show/hide&quot; function on the actual button graphic or should the ProjectSeven behavior do everything without needing to place a behavior on the actual button? HEEELP, I'm desperate!

<div id=&quot;Layer1&quot; style=&quot;position:absolute; left:361px; top:247px; width:116px; height:50px; z-index:1; visibility: hidden;&quot;><a href=&quot;button.html&quot; onMouseOut=&quot;MM_swapImgRestore()&quot; onMouseOver=&quot;MM_swapImage('button1','','../images/button1_on.gif',1)&quot;><img src=&quot;../images/Button1_off.gif&quot; name=&quot;buttonname&quot; width=&quot;116&quot; height=&quot;19&quot; border=&quot;0&quot;></a></div>
 
both sites have tutorials that DO work....!
just follow them...
All the best!

> need more info?
:: don't click HERE ::
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top