javascript下拉效果

时间：2022-07-02 15:01:54 编辑：袖梨来源：一聚教程网

YPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.***w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

提示：您可以先修改部分代码再运行

<title></title>
<style type="text/<a href=" http: target="_blank">css">
*{ margin:0px; padding:0px; border:0px; }
body{ font-size:12px; color:#333;text-align:center;}
.Test5study{ background:#fff;}
.Test5study{text-align:left;height:auto;border:solid 1px #F7BE21;margin:10px auto 0px;overflow: hidden;position: absolute;left: 10px;top: 0px; }
.Test5study h2{font-size:14px;line-background:#FFF7C6;text-indent:10px;position:relative;border-top: 1px solid #fff;border-bottom: 1px solid #F7BE21; font-weight:normal;cursor:pointer;}
.Test5study h2 span{font-weight: normal;position:absolute;top:0;right:6px;}
.Test5study li{border-bottom:dashed 1px #eee;}
.Test5study {border-bottom:solid 1px #F7BE21;}
.TxtList{ list-style:disc url(none); margin:6px 10px 6px 20px;}
</style>

<div id="Test5study" class="Test5study">
		<h2 id="t1" onclick="ShHi('t1','h1');">传说中的标题<span>更多...</span>
</h2>
		<ul class="TxtList" id="h1" style="display:none;">
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
		</ul>
		<h2 id="t2" onclick="ShHi('t2','h2');">传说中的标题<span>更多...</span>
</h2>
		<ul class="TxtList" id="h2" style="display:none;">
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
		</ul>
		<h2 id="t3" onclick="ShHi('t3','h3');">传说中的标题<span>更多...</span>
</h2>
		<ul class="TxtList" id="h3" style="display:none;">
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
		</ul>
		<h2 id="t4" onclick="ShHi('t4','h4');">传说中的标题<span>更多...</span>
</h2>
		<ul class="TxtList" id="h4" style="display:none;">
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
			<li>请帮忙把这段代码再优化优化...</li>
		</ul>
</div>
<script type="text/javascript">
/*

Homepage:www.111com.net
*/
function $(d){return document.getElementById(d);}
function f(d){var t=$(d);if (t){return t.style;}else{return null;}}
function Hi(){var items = document.getElementsByTagName("ul");for (var i=0;i<items.length;i++){items[i].style.display='none';}}
function Hl(){var iteml = document.getElementsByTagName("h2");for (var j=0;j<iteml.length;j++){iteml[j].style.fontWeight='normal';}}
function h(d){var s=f(d);var b=s.display;if (b=='none'){return true;}else{return false;}}
function ShHi(ii,jj){if(h(jj)){f(jj).display='block';f(ii).fontWeight='bold';}else{f(jj).display='none';f(ii).fontWeight='normal';}}
</script>

提示：您可以先修改部分代码再运行

推荐专题

最新下载

热门教程

javascript下拉效果

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程