Page 1 of 1

javascript changing css properties

Posted: Fri Sep 16, 2005 12:23 pm
by kirilisa
Can anyone tell me how to change the top and left css properties with javascript?

I know you can do for instance

Code: Select all

var div1 = document.getElementById('box1');
div1.style.display = 'none';
but what if I want to do

Code: Select all

div1.style.left= 35mm;
?? It doesnt' work.

Thanks.

Posted: Fri Sep 16, 2005 12:24 pm
by feyd
you must use strings.

Posted: Fri Sep 16, 2005 1:29 pm
by kirilisa
Sorry, I don't know what you mean. Could you give an example, or be more specific?

Thanks.

Posted: Fri Sep 16, 2005 1:39 pm
by ryanlwh

Code: Select all

div1.style.left= '35mm';

Posted: Fri Sep 16, 2005 2:22 pm
by kirilisa
Oh I see what you were saying. I don't think that is my probelm though. I think, from looking at it again, my problem is not knowing how to do math properly with JS.



In my case, I have

Code: Select all

var =  3 + 7;
div1.style.left=var;
(The reason that

Code: Select all

var = 3 + 7
is because it is adding up a bunch of defined or otherwise gotten constants from PHP.)

I think the issue is that it isn't summing the 3+7 when it changes the CSS. It's interesting: if I

Code: Select all

alert(var)
it gives me 10, but I bet when setting the CSS it is treating it like a string, or something. is there some way to type the results? to force it to actually add them up?

Bleh. I hate Javascript.

Posted: Fri Sep 16, 2005 2:33 pm
by ryanlwh
var is a keyword to declare a variable... maybe

Code: Select all

var leftSide = 3+7;
div1.style.left = leftSide;

Posted: Fri Sep 16, 2005 3:25 pm
by feyd
giving CSS a number when it needs a length value will give basically undefined results.

Code: Select all

var x = 3 + 7;
obj.style.left = x + 'mm';
will set '10mm'