非常适合5uCMS的隔行换色代码
1、列表页模板调用代码
<div id="listbox1">
<!--page:{$size=8}-->
<div id="class_list">
<div class="title"><span>[page:createtime $format=yy-mm-dd]</span><a href="[page:aurl]">[page:titlex $len=48]</a></div>
<p><a href="[page:aurl]">[page:description $len=350 $lenext=...]</a></p>
</div>
<!--page-->
<div id="fpage">{tag:page}</div>
</div>
2、在列表页模板底部或者是</head>之前放入以下代码
<script type="text/javascript">
<!--
var Ptr=document.getElementById("listbox1").getElementsByTagName("p");
function $() {
for (i=1;i<Ptr.length+1;i++) {
Ptr[i-1].className = (i%2>0)?"t1":"t2";
}
}
window.onload=$;
for(var i=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>
3、给出需要用到的关键几处CSS代码,完整结合自己的网站风格还需您自行调试~~
#class_list p
{
font-size: 12px;
line-height: 25px;
text-indent: 2em;
color: #333333;
margin-top: 5px;
}
.t1
{
background-color: #EFFEDD;
}
.t2
{
background-color: #FFFFFF;
}
.t3
{
background-color: #D2FCA0;
}