高亮显示

最新推荐文章于 2020-02-27 15:57:59 发布

biggrand

最新推荐文章于 2020-02-27 15:57:59 发布

阅读量642

点赞数

文章标签：数据高亮显示

本文链接：https://blog.youkuaiyun.com/biggrand/article/details/78492615

版权

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        .dd{
            width: 660px;
            height: 420px;
            margin: 0 auto;
            padding: 1px;
            background-color: yellow;
        }
        ul li{
            float: left;
            list-style: none;
        }
    </style>
    <script src="js/jquery-1.11.1.min.js"></script>
    <script>
        $(function(){
            $("li").mouseenter(function(){//鼠标移上其他模糊
                $(this).css("opacity",1).siblings().css("opacity",0.6);
            });
            //给div添加离开的事件
            $("div").mouseleave(function(){
                $(this).children("ul").eq(0).children("li").css("opacity",1);
            });
        });         
    </script>
</head>
<body>
    <div class="dd">
        <ul>
            <li><img src="img/01.jpg"/></li>
            <li><img src="img/02.jpg"/></li>
            <li><img src="img/03.jpg"/></li>
            <li><img src="img/04.jpg"/></li>
            <li><img src="img/05.jpg"/></li>
            <li><img src="img/06.jpg"/></li>
        </ul>
    </div>
</body>