View Full Version : Resizing Divs (Expanding, Contracting)

08-20-2007, 10:21 PM

I am currently designing a site without the use of tables. Although I will past my code bellow, I will explain what I intend to do: Each div contains a text header, a button (plus or minus) located to the right of the label, and text below (which may be a list of items, or a block of text); the latter being contained inside of another div (so it's a div inside of a div)
Once the user clicks on the button or on the <h3>label, I would like the div that contains the list or the block of text to go down to height zero, which would bring the bottom divs upward and resize the height of the entire page (which is set to auto), and change the button from minus to plus (which will not be visible since the files are not included, but it's okay because that part works well anyway).

This mechanism works well in firefox and ie7, but i6 hides the visibility of the contents upon a click without resizing the div to zero; therfore I don't get the expanding/contracting effect that I was hoping for.

Please note the attached txt and css files.

Thank you in advance for any assistance.

Rafael Lucchese.

08-21-2007, 08:22 AM
Instead of visibility, have a try on

document.getElementById(listString + "Inside").style.display = "none";

document.getElementById(listString + "Inside").style.display = "block";

I couldn't run your code without errors in Mozilla, its better to give a link to your page since these files have a lot of directory dependencies.

08-21-2007, 08:49 AM
Have you tried jQuery? This could give it some visual jazz as well as easily do what you want.

Look at these examples:

08-21-2007, 04:58 PM
Changing the statement at the JavaScript to display = "none"; has apparently solved the problem. I will do some more looking here, finish the changes to both the script and the css just to make sure that it is really working well.

The JQuery looks very interesting, I will keep that in mind for future uses as well.

Thank you again.


08-23-2007, 05:12 PM
The issue is resolved, thanks again.