zoukankan      html  css  js  c++  java
  • 隔行变色加高亮显示

    1.获取奇数行和偶数行

    2.设置不一样的颜色

    3.鼠标进入设置其他颜色

    4.移开恢复正常或者鼠标进入重新设置隔行变色覆盖之前操作

    $(function () {
                //高大上隔行变色
                fn();
                //鼠标进入高亮显示
                $("ul li").mouseover(function () {
                    fn();
                    $(this).css("background","red");
                });
    
                //隔行变色
                function fn(){
                    $("ul li:odd").css("background","skyblue");
                    $("ul li:even").css("background","yellowgreen");
                }
            });
        </script>
    </head>
    <body>
        <ul>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
            <li>以色侍人,色衰而爱驰也;以才侍人,才进得久,互赏而终...</li>
        </ul>
  • 相关阅读:
    js项目结合的注意点
    cookie练习
    json记载字符个数
    js,jQuery获取标签
    新人签到
    使用Resources类搭建Unity简单的资源管理工具类
    初识vue
    原生JS写出贪吃蛇
    用js做一个简单的班级点名器
    Javascript 的"循环语句"
  • 原文地址:https://www.cnblogs.com/rainbowupdate/p/12574609.html
Copyright © 2011-2022 走看看