Please see the below code. When i click on the close image, the collapseWindow div should be hidden and the rightColumn should occupy the area. When i click on the image again, the collapseWindow DIV should Show as on the default view and rightColum should go back to its original width.
Please Help.
HTML Code:<html><head> <style> #wrapper{width:100%;} #leftColumn{width:25%; float:left; background-color:#CCCCCC;} #rightColumn{width:75%; float:left; background-color:#6699FF;} </style> </head> <body> <div id="wrapper"> <div id="leftColumn"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="50px"><a href="#"><img src='http://www.totaltutorials.com/img/thumb/1690.jpg' width=50 height="50" border="0" ></a></td> <td> <div id="collapseWindow">this div should be hidden and the rightColumn should occupy this area </div> </td> </tr> </table> </div> <div id="rightColumn"> <p><br> Right Column <br> </p> </div> </div> </body> </html>



Reply With Quote

Bookmarks