Connecting Tech Pros Worldwide Help | Site Map

resizing css div in javascript

  #1  
Old July 20th, 2005, 12:54 PM
Orson
Guest
 
Posts: n/a
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


  #2  
Old July 20th, 2005, 12:54 PM
Fabian
Guest
 
Posts: n/a

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

  #3  
Old July 20th, 2005, 12:54 PM
Lasse Reichstein Nielsen
Guest
 
Posts: n/a

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.'
  #4  
Old July 20th, 2005, 12:55 PM
Orson
Guest
 
Posts: n/a

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


Similar Threads
Thread Thread Starter Forum Replies Last Post
Resize a DIV to fill entire height of page? Please help ShutterMan answers 14 February 1st, 2008 10:35 PM
how do you prevent the onclick action from being fired in IE since answers 4 November 12th, 2007 11:56 PM
Resizing a DIV enceladus311@yahoo.com answers 4 December 12th, 2006 05:15 PM
resizing image? roN answers 3 December 7th, 2006 10:45 PM