How Can I Close And Open Tables

[faceofdie 0]

HiHow can i open and close tables like this site http://www.ashiyane.com/ the right and left table has Plus Jpg and when you click on the table close ?Plz Help me thank

[no9t9 0]

Hi

How can i open and close tables like this site

http://www.ashiyane.com/

the right and left table has Plus Jpg and when you click on the table close ?

Plz Help me

thank

<{POST_SNAPBACK}>

you should use a DIV to hold the information in the table and give it a name. That div can be "collapsed" by changing the HEIGHT property through javascript.

 

[/br]<table border=1>[br]<tr><td><img src="arrowup.gif" id=arrow onclick="collapse();"></td></tr>[/br]<tr><td><div id=div1 style="height:100px;overflow:auto">Your info here</div></td></tr>[br]</table>[/br]

 

you have to use java script to create the function "collapse" that is called using the "onclick" event for the arrow image.

 

in the javascript function you have to change the height of the DIV (named "div1" in this case) and also change the arrow image (named "arrow")

 

[/br]<script>[/br]var originalwindowsize=100;[br]function collapse() {[/br]if (document.all.div1.style.height != "1px") {[br] ?originalwindowsize=parseInt(document.all.div1.style.height);[/br] ?document.all.div1.style.height=1;[br] ?document.all.div1.style.overflow="hidden";[/br] ?document.all.arrow.src="arrowdown.gif"; }[br]else {[/br] ?document.all.div1.style.height=originalwindowsize;[br] ?document.all.div1.style.overflow="auto"; ?[/br] ?document.all.arrow.src="arrowup.gif"; }}[br]</script>[/br]

This code will only work in IE (document.all)... I will let you figure out the equivalent for netscape/firefox/etc. If you want, you can view the source on my website for the firefox/etc. code but mine is a little more complicated than the one listed above.