javascript and layers

[omoutop]

Hello all and thanks for any help/ideas.

We own some promotional (advertising) sites (mostly static pages).
Our goal is to create a dynamic page to load some relevant banners on the right of the site.

Our aproach was, to use layers (since most pages are static). So, inside the layer we load a dynamic page that shows whatever banners we choose (from a control panel).

The problem occured when we tested the project under different screen resolutions (from notebooks to widescreen monitors).
The layer appears in all the wrong places - eiher inside the main site or far away or not showing at all (in small resolutions)

Our question is... is there a way (with javascript/ajax) to determine the user's screen resolution and change the layer's coordinates accordingly, so as the layer to appear always in the same spot?
If the above question has a positive answer, can you point us to a good tutorial/article? Our knowledge with javascript is rather limited

[rocknbil]

By "layers" I am presuming you are using a z-index property in some way?

You may be better off assigning a div right to the page where you want it,

<div id="ad-placeholder"></div>

Then use a document.write or assign innerHTML to the div

var adDiv = document.getElementById('ad-placeholder');
adDiv.innerHTML = 'Your Ad Copy';

[whoisgregg]

Depending on the browser, there are different places to find the current window size.

window.innerHeight / window.innerWidth
document.body.clientHeight / document.body.clientWidth

You can make a reusable function that checks those values. From my experience, it's also important to setup an event handler for onresize that moves the dynamically placed elements when the user changes their window size.

However, it seems like this would be much easier solved using CSS. You may want to try posting the relevant style code into the CSS forum [webmasterworld.com].

[omoutop]

at rocknbil:

thats an approach we hadn't though... we will give this a try and see how it will behave

thanks for the tip :P