DelphiFAQ Home Search:

Dynamically collapse or expand a section of a web page

 

comments26 comments. Current rating: 5 stars (7 votes). Leave comments and/ or rate it.

Question:

I want to dynamically collapse or expand a section of a web page. The idea is to show the user a short screen with a few options, and if the user wants to see any detail, then he will click on an "Expand" link and the relevant section will show its details.
This should be done in Javascript, with no extra http page views.

Answer:

The trick is to put the to-be-collapsed sections in DIV tags.

The code below has a DIV section named 'tbl' which is initially hidden. Then by clicking on a link it can be expanded or hidden again.

Make sure to set the initial style to display:none
<div id=tbl name=tbl style="overflow:hidden;display:none">

<body>

Some text before

<div id=tbl name=tbl style="overflow:hidden;display:none">
<table border=1>
<tr><td>test</td></tr>
<tr><td>test</td></tr>
<tr><td>test</td></tr>
</table>
</div>

some text after

<script language="JavaScript" type="text/javascript">
<!--
function sizeTbl(h) {
  var tbl = document.getElementById('tbl');
  tbl.style.display = h;
}
// -->
</script> 
<br>
<a href="javascript:sizeTbl('none')">Hide</a>
 
<a href="javascript:sizeTbl('block')">Expand</a>

</body>

Content-type: text/html

Comments:

You are on page 2 of 2, other pages: 1 [2]
2012-08-10, 04:39:46
anonymous from Madras, India  
hiiiiiiiiiiiiiii
2012-11-12, 02:55:44
anonymous from United Kingdom  
2012-11-12, 05:31:18
anonymous from United States  
2012-12-24, 08:57:56
anonymous  
rating
Excellent!
2013-02-06, 10:31:58
anonymous from India  



Keywords:
2013-07-22, 17:19:30
anonymous from Panama  
rating
You are the best men THANKS
2014-12-16, 18:18:18
anonymous from Venezuela  
hey there and thank you for your info – I’ve definitely pieckd up something new from right here. I did however expertise a few technical issues using this web site, since I experienced to reload the site many times previous to I could get it to load correctly. I had been wondering if your web hosting is OK? Not that I'm complaining, but sluggish loading instances times will very frequently affect your placement in google and can damage your quality score if ads and marketing with Adwords. Anyway I am adding this RSS to my e-mail and could look out for much more of your respective exciting content. Make sure you update this again soon..
2014-12-16, 21:18:22
anonymous from Indonesia  
KAMI SEKELUARGA TAK LUPA MENGUCAPKAN PUJI SYUKUR KEPADA ALLAH S,W,T
dan terima kasih banyak kepada AKI atas nomor togel.nya yang AKI
berikan 4 angka 8826 alhamdulillah ternyata itu benar2 tembus AKI.
dan alhamdulillah sekarang saya bisa melunasi semua utan2 saya yang
ada sama tetangga.dan juga BANK BRI dan bukan hanya itu AKI. insya
allah saya akan coba untuk membuka usaha sendiri demi mencukupi
kebutuhan keluarga saya sehari-hari itu semua berkat bantuan AKI..
sekali lagi makasih banyak ya AKI… bagi saudara yang suka main togel
yang ingin merubah nasib seperti saya silahkan hubungi KI JAYA WARSITO,,di no (((085-342-064-735)))
insya allah anda bisa seperti saya…menang togel 790 JUTA , wassalam.


dijamin 100% jebol saya sudah buktikan...sendiri....







Apakah anda termasuk dalam kategori di bawah ini !!!!


1'Dikejar-kejar hutang

2'Selaluh kalah dalam bermain togel

3'Barang berharga anda udah habis terjual Buat judi togel


4'Anda udah kemana-mana tapi tidak menghasilkan solusi yg tepat


5'Udah banyak Dukun togel yang kamu tempati minta angka jitunya
tapi tidak ada satupun yang berhasil..







Solusi yang tepat jangan anda putus asah... KI .JAYA WARSITO akan membantu
anda semua dengan Angka ritual/GHOIB:
butuh angka togel 2D 3D 4D SGP / HKG / MALAYSIA / TOTO MAGNUM / dijamin
100% jebol
Apabila ada waktu
silahkan Hub: KI JAYA WARSITO DI NO: [[[085-342-064-735]]]


ANGKA GHOIB: SINGAPUR 2D/3D/4D/



ANGKA GHOIB: HONGKONG 2D/3D/4D/



ANGKA GHOIB; TEXAS



ANGKA GHOIB; TOTO/ MAGNUM 4D/5D/6D/



ANGKA GHOIB; LAOS
2014-12-31, 22:01:47
anonymous from Venezuela  
I in addition to my bdidues ended up reading the good tips located on your web blog then all of a sudden came up with a horrible suspicion I never thanked the web blog owner for them. The ladies were definitely for this reason happy to read them and now have absolutely been tapping into these things. Many thanks for truly being considerably thoughtful and also for choosing this form of brilliant issues most people are really wanting to learn about. Our own honest regret for not expressing gratitude to you sooner. http://svnmao.com [url= http://afqezz.com]a..qezz[/url] [link= http://kcejwowxd.co..wxd[/link]
2014-12-31, 22:02:10
anonymous from Brazil  
I in addition to my bdidues ended up reading the good tips located on your web blog then all of a sudden came up with a horrible suspicion I never thanked the web blog owner for them. The ladies were definitely for this reason happy to read them and now have absolutely been tapping into these things. Many thanks for truly being considerably thoughtful and also for choosing this form of brilliant issues most people are really wanting to learn about. Our own honest regret for not expressing gratitude to you sooner. http://svnmao.com [url= http://afqezz.com]a..qezz[/url] [link= http://kcejwowxd.co..wxd[/link]
2015-02-01, 01:11:00
anonymous  
If you wrote an article about life we'd all reach eneenhtinmlgt.
You are on page 2 of 2, other pages: 1 [2]

 

 

NEW: Optional: Register   Login
Email address (not necessary):

Rate as
Hide my email when showing my comment.
Please notify me once a day about new comments on this topic.
Please provide a valid email address if you select this option, or post under a registered account.
 

Show city and country
Show country only
Hide my location
You can mark text as 'quoted' by putting [quote] .. [/quote] around it.
Please type in the code:

Please do not post inappropriate pictures. Inappropriate pictures include pictures of minors and nudity.
The owner of this web site reserves the right to delete such material.

photo Add a picture: