`
netxdiy
  • 浏览: 681839 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

javascript实现的LI列表输出,隔行同色的代码

 
阅读更多

javascript实现的LI列表输出,隔行同色的代码

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>the9web.com</title>
</head><body>
<style>......
.mytable
{...}{...}{...}{border-collapse:collapse;border:solid#6AA70B;border-width:0px000px;width:50%;}
.mytableulli
{...}{...}{...}{padding-top:5px;text-indent:2em;list-style:none;background:url(http://www.blueidea.com/img/common/new_flash.gif)3px50%no-repeat;border-bottom:#6AA70B1pxdotted;font-family:"Verdana,宋体";font-size:12px;color:#008000;text-align:left;height:25px;}
.mytableulli.t1
{...}{...}{...}{background-color:#EFFEDD;}/**//**//**//*第一行的背景色*/
.mytableulli.t2
{...}{...}{...}{background-color:#ffffff;}/**//**//**//*第二行的背景色*/
.mytableulli.t3
{...}{...}{...}{background-color:#D2FCA0;}/**//**//**//*鼠标经过时的背景色*/
</style>
<bodystyle=margin:0;>
<divalign="center">
<divclass=mytableid=tab>
<ul>
<li><ahref="http://the9web.com">这个是第1行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第2行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第3行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第4行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第5行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第6行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第7行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第8行的文字,大家看清楚了</a></li>
<li><ahref="http://the9web.com">这个是第9行的文字,大家看清楚了</a></li>
</ul></div><scripttype="text/javascript">......
<!--
varPtr=document.getElementById("tab").getElementsByTagName("li");
function$()......{
for(i=1;i<Ptr.length+1;i++)......{
Ptr[i
-1].className=(i%2>0)?"t1":"t2";
}

}

window.onload
=$;
for(vari=0;i<Ptr.length;i++)......{
Ptr[i].onmouseover
=function()......{
this.tmpClass=this.className;
this.className="t3";
}
;
Ptr[i].onmouseout
=function()......{
this.className=this.tmpClass;
}
;
}

//-->
</script>
</body>
</html>


分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics