我试图使图像淡入淡出到特定的不透明度，但当鼠标悬停(mouseenter、mouseleave)位于父 div 上时触发。
下面的代码显示了两个 div 元素(工作正常)，但由于某种原因，当我将“.children(“div”)”更改为“.children(“img”)”时，它不起作用，因为我实际上有当然还有图像。
我缺少一些语法或命名约定吗？
$(document).ready(function(){
$(".title").mouseenter(function(){
$(this).children("img").fadeTo("fast", 0.8);
});
$(".title").mouseleave(function(){
$(this).children("img").fadeTo("fast", 1.0);
});
});.wrap {
width: auto;
margin-left: 2%;
margin-right: 2%;
padding-left: 2%;
padding-right: 2%;
float: none;
}
.title {
border: 1px solid #C1C1C1;
background: #000;
cursor: pointer;
transition-property: all;
transition-duration: 0.2s;
transition-timing-function: ease;
transition-delay: 0;
margin-bottom: 0px;
position: relative;
margin-top: 40px;
}
img {
height: 100px;
width: 100px;<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<div class="fluid wrap" ontouchstart="">
<div class="title">
<img src="https://inkplant.com/images/code/red-box.jpg"/>
</div>
</div>最佳答案
您没有提及图像在哪里，但我认为您想要:
$(document).ready(function(){
$(".title").mouseenter(function(){
$(this).find("img").fadeTo("fast", 0.8);
});
$(".title").mouseleave(function(){
$(this).find("img").fadeTo("fast", 1.0);
});
});
这是因为
.children
仅影响目标元素的直接后代。
.find
将查找作为目标节点子节点的任何元素
关于javascript - 鼠标悬停事件控制淡入淡出，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30721580/