table htmlelement效果
复制代码 代码如下:
var br_cc = (function(){
var seteffect = function(els,params){
var settings = {c1:#eee,c2:#ccc,c3:#f00};
$.extend(settings,params);
els.each(function(i){
var self = $(this);
if(i%2==0){
this._bg = settings.c1;
}else{
this._bg = settings.c2;
}
self.css({background-color:this._bg,cursor:pointer});
self.mouseover(function(){
self.css(background-color,settings.c3);
});
self.mouseout(function(){
self.css(background-color,this._bg);
});
});
};
var cc_table = function(params){
params = params || {};
var box = params.box?$(#+params.box):$(body).eq(0);
seteffect(box.find(tr));
};
var cc_div = function(params){
params = params || {};
var box = params.box?$(#+params.box):$(body).eq(0);
var els = params.tagclass?box.find(.+settings.tagclass):box.find(div);
seteffect(els);
};
return {cc_tb:cc_table,cc_div:cc_div};
})();
$(document).ready(function(){
br_cc.cc_tb({box:stu-datas-tb});
br_cc.cc_div({box:stu-datas-div});
});
使用非常简单,就不多废话了。有需要的朋友直接拿去。别忘了顶哈。
table和div的数据表示html结构:
复制代码 代码如下:
table htmlelement效果
idnameagesex
1 张三 18 男
1 张三 18 男
1 张三 18 男
1 张三 18 男
div htmlelement效果
1李倩20女
1李倩20女
1李倩20女
1李倩20女