JS实现表格间隔颜色。鼠标滑动高亮显示详解编程语言

$(function(){ 
	$(".high_light tr").mouseover(function() {   
			$(this).addClass("over");   
		}).mouseout(function() {   
			$(this).removeClass("over");   
		});   
})
<style> tr.over td {background:#D9EDF7;}</style>

下面是复制过来的别人的

<script type="text/javascript" >   
$(document).ready(function() {   
            $(".stripe tr").mouseover(function() {   
   
                        $(this).addClass("over");   
                    }).mouseout(function() {   
                        $(this).removeClass("over");   
                    });   
            $(".stripe tr:even").addClass("alt");   
        }   
   
)   
   
</script>   
   
<style type="text/css">   
/*注意选择器的层叠关系*/   
th {   
        background:#0066FF;   
        color:#FFFFFF;   
        line-height:20px;   
        height:30px;   
}   
    
td {   
        padding:6px 11px;   
        border-bottom:1px solid #95bce2;   
        vertical-align:top;   
        text-align:center;   
}   
    
td * {   
        padding:6px 11px;   
}   
    
tr.alt td {   
        background:#ecf6fc;  /*这行将给所有的tr加上背景色*/   
}   
    
tr.over td {   
        background:#bcd4ec;  /*这个将是鼠标高亮行的背景色*/   
}   
</style>

来自:http://my.oschina.net/u/2411815/blog/599760

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/8743.html

(0)
上一篇 2021年7月18日
下一篇 2021年7月18日

相关推荐

发表回复

登录后才能评论