div li隔行变色 鼠标悬浮高亮显示 jquery控制css样式

$("table tr").eq(1).remove();              //删除第一行数据
$("#tbl1").find("tr").eq(0).remove();  //删除第一行数据,eq的下标是从0开始。
$("#tblContent tr:even").css("background-color", "#333");   //奇数行
$("#tblContent tr:odd").css("background-color", "blue");//偶数行

div li隔行变色:

<style type="text/css">  
    .bcloer{background-color: Red;}  
</style>  
<script type="text/javascript">  
    $(document).ready(function () {  
        //$("#UL_id li:even").addClass("bcloer");         //方式一  
        $("#UL_id li:even").attr("className", "bcloer");  //方式二  
    })  
</script>  
<div>  
    <ul id="UL_id">  
        <li>单数</li>  
        <li>双数</li>  
        <li>双数</li>  
        <li>单数</li>  
        <li>双数</li>  
        <li>双数</li>  
    </ul>  
</div>

div li鼠标悬浮高亮显示:

    <style type="text/css">  
        .blue{background: #bcd4ec;}  
    </style>  
    <script type="text/javascript">  
        $(document).ready(function () {  
            $("#orderedlist li").hover(function () {  
                $(this).addClass("blue");  
            }, function () {  
                $(this).removeClass("blue");  
            });  
        });  
    </script>  
    <div>  
        <ul id="orderedlist">  
            <li>11111111111111111111111111111111</li>  
            <li>22222222222222222222222222222222</li>  
            <li>33333333333333333333333333333333</li>  
            <li>44444444444444444444444444444444</li>  
            <li>55555555555555555555555555555555</li>  
            <li>66666666666666666666666666666666</li>  
            <li>77777777777777777777777777777777</li>  
        </ul>  
    </div>  

div li隔行变色,鼠标悬浮高亮显示:

    <style type="text/css">  
        /*.hover的样式是必须得,具体样式效果自行设置*/  
        .hover{ background-color:#222C35; color:#FFF;}  
        .hover,.hover a{color:#FFF;}  
    </style>  
    <script type="text/javascript">  
        $(document).ready(function () {  
            jQuery.hoverPlugin = {  
                hover: function (hoverid) {  
                    $(hoverid).hover(function () {  
                        $(this).addClass("hover")  
                    }, function () {  
                        $(this).removeClass("hover")  
                    })  
                }  
            };  
            $.hoverPlugin.hover('#hoverul li');  
            $.hoverPlugin.hover('#hoverdiv a')  
        });  
    </script>  
    <div>  
        <ul id="hoverul">  
            <li>jquery图片左右来回循环飘动</li>  
            <li>jquery图片左右来回循环飘动</li>  
            <li>jquery图片左右来回循环飘动</li>  
            <li>jquery图片左右来回循环飘动</li>  
            <li><a href="#">jquery 特效</a></li>  
            <li><a href="#">jquery 特效</a></li>  
            <li><a href="#">jquery 特效</a></li>  
            <li><a href="#">jquery 特效</a></li>  
        </ul>  
    </div>  
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值