标签:其他 sibling one img div css样式 去掉 hover png
主要的jQuery代码:
1 $(function() { 2 $("ul li").hover(function() { 3 // over 4 //鼠标移入当前列透明度为1 其他列为0.5 5 $(this).css("opaacity", "1").siblings("li").addClass("opacity_li"); 6 7 }, function() { 8 // out 9 //鼠标移出的时候把其他列透明度去掉 10 $(this).siblings().removeClass("opacity_li"); 11 }); 12 })
html代码:
1 <ul> 2 <li> 3 <a href="#"><img src="images/问奈何.png" /></a> 4 </li> 5 <li> 6 <a href="#"><img src="images/夏承凛.png" /></a> 7 </li> 8 <li> 9 <a href="#"><img src="images/怀璧明罪问奈何.png" /></a> 10 </li> 11 </ul>
css样式:
1 * { 2 margin: 0; 3 padding: 0; 4 } 5 6 ul { 7 list-style: none; 8 margin: 0 auto; 9 width: 608px; 10 height: 342px; 11 } 12 13 img { 14 width: 40%; 15 height: 40%; 16 } 17 18 .opacity_li { 19 opacity: 0.5; 20 }
标签:其他 sibling one img div css样式 去掉 hover png
原文地址:https://www.cnblogs.com/xiemin-minmin/p/11027342.html