PDA

View Full Version : Problem changing margin with onLoad event!!!



davidvh73
12-11-2006, 10:07 PM
Hi, I've been searching for 2 days now but can't figger it out. I'm trying to change the top margin of a layer depending on a users screen resolution.
Here's what I have so far:

A container layer and a content layer:

<style type="text/css">
<!--
#container {
position:absolute;
width:450px;
z-index:1;
overflow: hidden;
height: 600px;
}
#content {
position:absolute;
width:450px;
z-index:2;
background-color: #B8B8B8;
height: 600px;
top: 0px;
left: 0px;
}
-->
</style>

I made a function to adjust the top margin according to the resolution:

<script type="text/javascript">
function adjustMargins()
{
if (screen.width==800||screen.height==600)
{
document.getElementById('container').style.marginTop=="10px";
}
else if (screen.width==1024||screen.height==768)
{
document.getElementById('container').style.marginTop=="30px";
}
else
{
document.getElementById('container').style.marginTop=="50px";
}
}
</script>

Then I have my 2 layers in the body and the onload event for the body:

<body onload="adjustMargins()">
<div id="container">
<div id="content">blablablabla</div>
</div>
</body>

BUT IT DOESN'T WORK. It does work if I use document.write("Something"), so the resolution get's detected, but something must be wrong with the document.getElementById('container').style.marginTop=="50px"; part.

Can someone help me out here, plz?

Greetz,
D.

jscheuer1
12-12-2006, 05:30 AM
You want:

document.getElementById('container').style.marginTop="10px";

not:

document.getElementById('container').style.marginTop=="10px";

The == is only for comparison, to set something equal, use just =