会python真的可以为所欲为0(回)
356天前
这里还有人吗1(回)
541天前这里还有人吗0(回)
541天前
每天面对着电脑屏幕，敲打键盘。我所面对的并不只是代码，而是一种生活方式。0(回)
766天前到处都是羊，不想上班0(回)
846天前
鸽子
0(回)
850天前
自适应宽度的标签导航.rar(免费下载)[0 次下载]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> |
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD> |
<meta name="keywords" content="JS代码,TAB标签,JS广告代码,JS特效代码" /> |
<meta name="description" content="此代码内容为自适应宽度的标签导航，属于站长常用代码，更多TAB标签代码请访问模板无忧JS代码频道。" /> |
<title>自适应宽度的标签导航_模板无忧</title> |
<META http-equiv=Content-Type content="text/html; charset=gb2312"> |
<STYLE type=text/css>BODY { |
FONT-SIZE: 14px; FONT-FAMILY: "宋体" |
} |
OL LI { |
MARGIN: 8px |
} |
#con { |
FONT-SIZE: 12px; MARGIN: 0px auto; WIDTH: 600px |
} |
#tags { |
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 0px 10px; WIDTH: 400px; PADDING-TOP: 0px; HEIGHT: 23px |
} |
#tags LI { |
BACKGROUND: url(images/tagleft.gif) no-repeat left bottom; FLOAT: left; MARGIN-RIGHT: 1px; LIST-STYLE-TYPE: none; HEIGHT: 23px |
} |
#tags LI A { |
PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BACKGROUND: url(images/tagright.gif) no-repeat right bottom; FLOAT: left; PADDING-BOTTOM: 0px; COLOR: #999; LINE-HEIGHT: 23px; PADDING-TOP: 0px; HEIGHT: 23px; TEXT-DECORATION: none |
} |
#tags LI.emptyTag { |
BACKGROUND: none transparent scroll repeat 0% 0%; WIDTH: 4px |
} |
#tags LI.selectTag { |
BACKGROUND-POSITION: left top; MARGIN-BOTTOM: -2px; POSITION: relative; HEIGHT: 25px |
} |
#tags LI.selectTag A { |
BACKGROUND-POSITION: right top; COLOR: #000; LINE-HEIGHT: 25px; HEIGHT: 25px |
} |
#tagContent { |
BORDER-RIGHT: #aecbd4 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #aecbd4 1px solid; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; BORDER-LEFT: #aecbd4 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #aecbd4 1px solid; BACKGROUND-COLOR: #fff |
} |
.tagContent { |
PADDING-RIGHT: 10px; DISPLAY: none; PADDING-LEFT: 10px; BACKGROUND: url(images/bg.gif) repeat-x; PADDING-BOTTOM: 10px; WIDTH: 576px; COLOR: #474747; PADDING-TOP: 10px; HEIGHT: 250px |
} |
#tagContent DIV.selectTag { |
DISPLAY: block |
} |
</STYLE> |
<META content="MSHTML 6.00.2800.1589" name=GENERATOR></HEAD> |
<BODY> |
<DIV id=con> |
<UL id=tags> |
<LI><A onClick="selectTag('tagContent0',this)" |
href="javascript:void(0)">标签一</A> </LI> |
<LI class=selectTag><A onClick="selectTag('tagContent1',this)" |
href="javascript:void(0)">标签二</A> </LI> |
<LI><A onClick="selectTag('tagContent2',this)" |
href="javascript:void(0)">自适应宽度的标签</A> </LI></UL> |
<DIV id=tagContent> |
<DIV class=tagContent id=tagContent0>第一个标签的内容</DIV> |
<DIV class="tagContent selectTag" id=tagContent1>第二个标签的内容</DIV> |
<DIV class=tagContent id=tagContent2>第三个标签的内容</DIV></DIV></DIV> |
<p> |
<SCRIPT type=text/javascript> |
function selectTag(showContent,selfObj){ |
// 操作标签 |
var tag = document.getElementById("tags").getElementsByTagName("li"); |
var taglength = tag.length; |
for(i=0; i<taglength; i++){ |
tag[i].className = ""; |
} |
selfObj.parentNode.className = "selectTag"; |
// 操作内容 |
for(i=0; j=document.getElementById("tagContent"+i); i++){ |
j.style.display = "none"; |
} |
document.getElementById(showContent).style.display = "block"; |
|
|
} |
</SCRIPT> |
</p> |
<table width="728" border="0" align="center" cellpadding="0" cellspacing="0"> |
<tr> |
<td><p align="center">代码整理：<a href="http://www.mb5u.com/" target="_blank">模板无忧</a> </p> |
<p align="center">＊尊重他人劳动成果，转载请自觉注明出处！注：此代码仅供学习交流，请勿用于商业用途。</p> |
<p align="center"></p> |
<p align="center"><p>这个TAB滑动门标签，可以自适应宽度，应用起来很方便。</p></p> |
<p align="center"></p></td> |
</tr> |
</table> |
</BODY></HTML> |
自适应宽度的标签导航.rar(免费下载)[0 次下载]
