本文共 1788 字,大约阅读时间需要 5 分钟。
方法一:
需要两张小图,一个表示上,一个表示下,本例中为toggle_gray_up.gif和toggle_gray_down.gif。源自。。html和javascript代码如下:<html><head><script language="JavaScript">function ToggleVisible(targetID, imageID, linkImage, linkImageCollapsed){ if (document.getElementById){ target = document.getElementById(targetID); if (target.style.display == "none") { target.style.display = ""; } else { target.style.display = "none"; } if (linkImageCollapsed != "") { image = document.getElementById(imageID); if (target.style.display == "none") { image.src = linkImageCollapsed; } else { image.src = linkImage; } } }}
</script></head>
<body>
<table width="300" border=1 id="test" cellpadding="0" cellspacing="0" ><tr> <td height=20 align=right> <a onClick="ToggleVisible('Contents','LinkImage','toggle_gray_up.gif','toggle_gray_down.gif'); return false;" href="#"> <div width=100% height=20><img id="LinkImage" src="toggle_gray_down.gif" src="toggle_gray_down.gif" alt="" border="0" /></div> </a> </td></tr>
<tr id="Contents"><td>test 123 123 12 test<br>test 123 123 12 test<br>test 123 123 12 test<br></td></tr></table></body></html>
方法二:
什么都不需要。直接点表头就可以实现折叠。源自。。html和javascript代码如下:<html><head><script language="JavaScript">function $(s){return document.getElementById(s);}function swap(s,a,b,c){$(s)[a]=$(s)[a]==b?c:b;}function hide(s){$(s).style.display=$(s).style.display=="none"?"":"none";}</script></head><body><table width="100%" border=1 id="test" cellpadding="0" cellspacing="0" >
<tr onClick="javascript:hide('content');swap('title','className','up','down');"> <td id="title" class="up">分类</td></tr> <tr id="content" ><td>test 123 123 12 test<br>test 123 123 12 test<br>test 123 123 12 test<br></tr></td></table></body></html>Trackback: http://tb.donews.net/TrackBack.aspx?PostId=768666
转载地址:http://sqici.baihongyu.com/