突出显示
当鼠标经过图片时，其他图片增加透明度，鼠标移出时，如下显示
代码：
<!DOCTYPE html><html><head lang=”en”> <meta charset=”UTF-8″> <title></title> vps云服务器 <style type=”text/css”> * { margin: 0; padding: 0; } ul { list-style: none; } body { background: #000; } .wrap { margin: 100px auto 0; width: 630px; height: 394px; padding: 10px 0 0 10px; background: #000; overflow: hidden; border: 1px solid #fff; } .wrap li { float: left; margin: 0 10px 10px 0; } .wrap img { display: block; border: 0; } </style> <script src=”jquery-3.5.1.min.js”></script></head><body> <div class=”wrap”> <ul> <li> <a rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” href=”#”><img src=”images/01.jpg” alt=”” /></a> </li> <li> <a rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” href=”#”><img src=”images/02.jpg” alt=”” /></a> </li> <li> <a rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” href=”#”><img src=”images/03.jpg” alt=”” /></a> </li> <li> <a rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” href=”#”><img src=”images/04.jpg” alt=”” /></a> </li> <li> <a rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” href=”#”><img src=”images/05.jpg” alt=”” /></a> </li> <li> <a rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” rel=”external nofollow” href=”#”><img src=”images/06.jpg” alt=”” /></a> </li> </ul> </div> <script> $(‘.wrap li’).hover(function() { $(this).siblings().stop().fadeTo(100, 0.3) }, function() { $(this).siblings().stop().fadeTo(100, 1) }) </script></body></html> 91873691
