<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
img{
width: 300px;
height: 300px;
transition: all linear 0.3s;
}
</style>
</head>
<body>
<!-- 要求：做一个多个图片移入移出凸显效果 -->
<img src="img/1.jpg" alt="">
<img src="img/2.jpg" alt="">
<img src="img/3.jpg" alt="">
<img src="img/4.jpg" alt="">
<script src="jquery-1.10.1.min.js"></script>
<script>
$("img").hover(function (){
$(this).siblings().css("opacity","0.6");
},function (){
$(this).siblings().css("opacity","1");
})
</script>
</body>
</html>
Processed:
0.011, SQL:
8
