PDA

View Full Version : Dreamweaver show/hide layers behaviour problem


Dreamweaver newbie
02-05-2011, 10:42 AM
I've made a website with 7 or so layers and positioned everything to the nth degree with CSS.
There is a menu bar at the top with four options with a hotspot over each option. When you click on a menu option some text coresponding to that particular menu option appears.
Each piece of text is on a layer.

you click on the hopspot it shows one text layer and hides the other three, using the behaviour show/hide layers option.

The problem is when you click on a menu option the text does not appear where it should be.

In the document window the text layer appears where I have positioned it but when previewed in the browser the text layer does not appear in the same place as it does in the doccument window when you click on the menu option.

any ideas? is it a bug?

I think it maybe a layer problem, but for the life of me I can't think what it could be.

any help much appreciated.

Corrosive
02-05-2011, 10:51 AM
It is a layer problem and they are a pretty bad way to lay out a website. Layers take their co-ordinates from the top left of the viewing window. You resize that window and the layers move.

Also, show/hide layers isn't ideal for showing pages. Ideally your menu should link to individual pages with your text on unless you really know what you are doing with a one-page website and the potential pitfalls of that approach.

Dreamweaver newbie
02-05-2011, 01:03 PM
Hello,

I did try linking to separate pages to show things but I had a problem as the linked page or text was not positioning exactly where I wanted it to be.

On the advice of another member here I tried the behaviour show/hide layers route.

Corrosive
02-05-2011, 01:06 PM
Yes, and it is the layers that are causing your positioning problems.

Ricky55
02-05-2011, 03:14 PM
You haven't made a website I'm afraid you've just constructed a jigsaw made from divs that will never look correct cross browser.

You'll run into endless problems building a page in this manner. The web is made from links not show hide behaviours, link to the pages separately.

You can do one page websites but not in this manner they should always be based on links so they work when JavaScript is disabled. Using Ajax and jQuery to load in the content. This type of site is way beyond your level at the moment though.

Nail the basics and the rest will follow. If you post an image of your design I can tell you how to lay it out.

Dreamweaver newbie
02-05-2011, 03:17 PM
corrosive,

is there any way around this layer positioning problem?

Ricky55
02-05-2011, 03:51 PM
Of course just build the page properly and scrap the layers.

Dreamweaver newbie
02-05-2011, 04:10 PM
why do the layers not render in the browser window in the same position as in the document window?

Corrosive
02-05-2011, 04:44 PM
why do the layers not render in the browser window in the same position as in the document window?

Layers take their co-ordinates from the top left of the viewing window. You resize that window and the layers move.



If you wanna learn you're gonna have to read what people tell you!

Dreamweaver newbie
02-05-2011, 04:55 PM
I have not ever talked about re-sizing the window.
I merely asked why do layers not appear in the browser window in the position that they were placed in teh document window?

Is it a bug? is it a javascript flaw?

As I said in my original post "The problem is when you click on a menu option the text does not appear where it should be."

I'd like a simple answer without being patronised.

Ricky55
02-05-2011, 06:58 PM
You've had several simple answers. You're just choosing to ignore them.

You only feel patronised because you're not listening. Its nothing to with Javascript its just that all browsers read and render elements differently and unless you use layers which are just absolutely position divs how they are supposed to be used within a positioning context you will find issues such as this.

Lets have a look at your page and we can tell you how to build it properly.

Corrosive
02-06-2011, 07:02 AM
I'd like a simple answer without being patronised.

I am not patronising you but I will spell it out once again. You said that;

In the document window the text layer appears where I have positioned it but when previewed in the browser the text layer does not appear in the same place as it does in the doccument window when you click on the menu option.

The document window has a smaller viewing area than a browser. So, when you set your layers up all nicely taking their co-ordinates from the top left of the document window, they all line up fine. When you preview in browser that viewing area is larger, still taking the same measurement from the top left they end up all out of place.