scriptygoddess

17 Mar, 2003

show hide layer in same position

Posted by: Jennifer In: Scripts

A few people have asked for code similar to this. Basically this will allow you to show/hide layers where one layer hides and another shows in it's place depending on what you click. This code comes with Dreamweaver MX, and if you have it and know how to use it – it's nice there because it gives you a UI to work with, but the same effect can be accomplished by hand.

Rather than post all the instructions here, I've put the information in the demo file(s) which you can download here.

Here's basically what it does:

show layer 1
show layer 2
hide the layers

Show this layer
You can also show this layer

6 Responses to "show hide layer in same position"

1 | kika

May 23rd, 2003 at 7:42 pm

Avatar

Any way to have Layer 1 as default, e.g., having that layer be visable when the page is loaded?

2 | mike

June 3rd, 2003 at 1:42 pm

Avatar

Yeah, this is a great tool but it has an odd effect: If you've scrolled down the page and click the show layer object, the page pops up to the top–does anyone know how to keep that effect from happening?

Cheers~

3 | Mary

July 19th, 2003 at 3:03 pm

Avatar

That scrolling is caused by the fact that the link (a href) points to "#".

I believe you could change that by having the link point to the JavaScript, rather than using it in the "onclick".

That does mean that you might have some non-js browsers being given a link that does not work. So I think you could fix that by having JavaScript print the link.

Example:

<script language="javascript" type="text/javascript">
<!–
document.write("<a href=\"javascript:onClick=\"MM_showHideLayers('Layer1',\",'show','Layer2',\",'hide')\">show layer 1</a>\");");
//–>
</script>

Now, I think that will work. I'm not sure if I escaped everything properly, but I think you get the idea.

4 | Lisa

March 11th, 2004 at 11:07 am

Avatar

Hi,

I was looking for code to hide/show layers on some of my web pages and yours was, by far, the best and simplest way to do it! I really love using scripts that are easy enough for anyone to use!!

Keep up the GREAT work!!

5 | Matt

May 3rd, 2004 at 2:24 am

Avatar

I've got a good one…I think. I have a sub-menu with three items on it to choose from. I would like each item to link to the same page, but cause a specific layer to become visible and hide the others.

What I need is a way for the new page to determine which link from the menu was hit by the user. That condition will show a designated layer and hide the others.

Is this posible?

6 | Celina

January 29th, 2005 at 3:31 am

Avatar

I couldn't find any other places to ask this so if you know of a forum that would be of help, please point me that way..

My question is this, is there a way to combine this show/hide layer function with your way of saving your sidebar/gadget cookies? I'd like to use this to display a different type of photo on the top of the page (photos in a category) but for that to be remembered on their visits.

Featured Sponsors

Genesis Framework for WordPress

Advertise Here


  • Scott: Just moved changed the site URL as WP's installed in a subfolder. Cookie clearance worked for me. Thanks!
  • Stephen Lareau: Hi great blog thanks. Just thought I would add that it helps to put target = like this:1-800-555-1212 and
  • Cord Blomquist: Jennifer, you may want to check out tp2wp.com, a new service my company just launched that converts TypePad and Movable Type export files into WordPre

About


Advertisements