.container ul{margin:0;padding:0;}
.container li{cursor:pointer;height:30px;width:200px;background-color:#FFC;line-height:30px;text-indent:1em;font-size:12px;}
.container .change{cursor:pointer;height:30px;width:200px;background-color:#C1F9CC;line-height:30px;text-indent:1em;font-size:12px;}
.container .current{cursor:pointer;height:30px;width:200px;background-color:#F66;line-height:30px;text-indent:1em;font-size:12px;}
window.onload = function() {
changeColor('content');
changeColor('content2');//写上要控制的UL的ID,想控制几个就控制几个
changeColor('content3');
}
function changeColor(id) {
var arrayli = document.getElementById(id).getElementsByTagName('li');
var bool = true;//奇数行为true
var oldStyle;//保存原有样式
for(var i = 0;i
第一个UL
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
第二个UL
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
第三个UL
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
- 隔行变色,划过变色
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
您可能感兴趣的文章:
- JS控制表格隔行变色
- js取模(求余数)隔行变色
- JS小功能(列表页面隔行变色)简单实现
- 原生JS操作网页给p元素添加onclick事件及表格隔行变色
- Table隔行变色的JavaScript代码
- javascript实现table表格隔行变色的方法
- 高效的表格行背景隔行变色及选定高亮的JS代码
- JS与jQuery实现隔行变色的方法
- JavaScript实现99乘法表及隔行变色实例代码
- 纯js实现隔行变色效果