Connecting Tech Pros Worldwide Help | Site Map

resizing css div in javascript

Orson
Guest
 
Posts: n/a
#1: Jul 20 '05
I have a CSS div defined as follows :
<div id="col-2" >

In some circumstances I want to change its width.
I have tried all the following within a javascript function:

document.getElementById("col-2").width= "900";
document.getElementById("col-2").resizeTo(900, 520);
document.getElementById("col-2").width.value= "900";
document.all.col-2.resizeTo(900, 520);
document.layers["col-2"].resizeTo(900, 520);

None of which have worked.

Within the stylesheet I initially had col-2 defined as an ID. Clutching at
straws I changed it to a class but that made no difference.

Can someone point out the right way to do it?
Thanks
Orson


Fabian
Guest
 
Posts: n/a
#2: Jul 20 '05

re: resizing css div in javascript


Orson hu kiteb:
[color=blue]
> I have a CSS div defined as follows :
> <div id="col-2" >
>
> In some circumstances I want to change its width.
> I have tried all the following within a javascript function:
>
> document.getElementById("col-2").width= "900";
> document.getElementById("col-2").resizeTo(900, 520);
> document.getElementById("col-2").width.value= "900";
> document.all.col-2.resizeTo(900, 520);
> document.layers["col-2"].resizeTo(900, 520);
>
> None of which have worked.[/color]

Thats because its a style. So you need something like...

document.getElementById("col-2").style.width= "900";

(warning: I havent double checked this)


--
--
Fabian
Visit my website often and for long periods!
http://www.lajzar.co.uk

Lasse Reichstein Nielsen
Guest
 
Posts: n/a
#3: Jul 20 '05

re: resizing css div in javascript


"Orson" <bilge43@yahoo.com> writes:
[color=blue]
> I have a CSS div defined as follows :
> <div id="col-2" >
>
> In some circumstances I want to change its width.
> I have tried all the following within a javascript function:[/color]

Blindly trying isn't the best approach :)
[color=blue]
> document.getElementById("col-2").width= "900";
> document.getElementById("col-2").resizeTo(900, 520);
> document.getElementById("col-2").width.value= "900";
> document.all.col-2.resizeTo(900, 520);
> document.layers["col-2"].resizeTo(900, 520);[/color]

You should test whether
document.getElementById("col-2")
works at all. Try starting out with:
alert( document.getElementById("col-2") );
If that works, go on to changing the position.
[color=blue]
> None of which have worked.[/color]
....[color=blue]
> Can someone point out the right way to do it?[/color]

Try:
document.getElementById("col-2").style.width = "900px";
That would use CSS to set the width.

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Orson
Guest
 
Posts: n/a
#4: Jul 20 '05

re: resizing css div in javascript



"Lasse Reichstein Nielsen" <lrn@hotpop.com> wrote in message
news:ad6wy6er.fsf@hotpop.com...[color=blue]
>
> You should test whether
> document.getElementById("col-2")
> works at all. Try starting out with:
> alert( document.getElementById("col-2") );
> If that works, go on to changing the position.
> Try:
> document.getElementById("col-2").style.width = "900px";
> That would use CSS to set the width.[/color]


Many thanks for the suggestions. I have finally got it all working.
Your suggestion to check my progress using alerts was instrumental in my
sorting it all out.

O


Closed Thread