Welcome to WebmasterWorld Guest from

Forum Moderators: incrediBILL

Message Too Old, No Replies

Targeting <div> "layers"

how to target layers



4:33 pm on Dec 29, 2005 (gmt 0)

5+ Year Member

I am new to Webmasterworld (registered 5 minutes ago), and so please forgive me if i am doing something wrong.

I was wondering how to target a layer just like you would a frame/iframe?

I would search the site, but haven't been able to find a search box.

any help is appreciated.


4:59 pm on Dec 29, 2005 (gmt 0)

10+ Year Member

What exactly do you mean? Do you mean with a link such as <a href="somepage.html#topic1"> or are you talking about when you lick on a link it calls up another page within an frame or iframe? The former is fairly simple; just use the div's ID as the name token. However, you can't use divs for the latter. Only frames and iframes can be used in such a way.


12:54 am on Dec 30, 2005 (gmt 0)

5+ Year Member

what i mean is that you have a layer with an image in it. Now what you want to do is when a link to another picture is clicked, you want the new (hyperlinked) picture to show up in place of the original one.

thus, it is effectively a frame, except that it is using layers.

i hope i made myself a bit more clear?


2:52 am on Dec 30, 2005 (gmt 0)

10+ Year Member

It doesn't work that way.

If you want to use divs to construct your page, then you have to make a whole new page for the next image.

To simplify things, you can use scripting (either javascript, php, asp, etc) to use a template and dynamically change the content (image).


4:55 am on Dec 30, 2005 (gmt 0)

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

One thing you could do is place each image in its own div. Just one of those divs should display when the page loads, and the others should be visibility:hidden. Each div should be position:absolute and perhaps use a different z-index so they don't displace the rest of the page layout. Then the links on the page can call a javascript function that switches the visibility of the divs.

So you're not targeting the same div with each link, instead you are switching the visibility of several divs on and off -- but they are all displayed in the same position on the page.

I've used this approach with text content, but it should work with images just as well. However, I only did this to be comaptible with a previously existing CMS. It's much more complex than an inline frame, and it fails without javascript.

In most cases, I would recommend an iframe to achieve this effect, rather than ising javascript to switch the display rules for multple divs.


10:36 am on Dec 30, 2005 (gmt 0)

5+ Year Member

thanks for the replies. i want to try and steer away from frames or iframes. personal preference.

the javascript suggestion is probably the better option. or i oculd just make a new page for each picture. but i'll see how each one goes. thanks.


Featured Threads

Hot Threads This Week

Hot Threads This Month