我在使用 jquery 和 css 时遇到问题,也许你们中的一些人可以帮助我 :)
这是我的 html 代码:
<html>
<head>
//myscripts
<script>
$(document).ready(function(){
$(".cover").hover(function(){
//the function i need to write
});
});
</script>
</head>
<body>
<div class="card">
<img class="cover" src="cover.png" />
<span class="detail" style="display:none;">
More details
</span>
</div>
<div class="card">
<img class="cover" src="cover.png" />
<span class="detail" style="display:none;">
More details
</span>
</div>
<div class="card">
<img class="cover" src="cover.png" />
<span class="detail" style="display:none;">
More details
</span>
</div>
</body>
</html>
当光标放在图像上时,细节类(封面父类的子类)应该淡入。 当用户将光标移到详细信息框上时,此框不应消失。 请帮助我,谢谢!
最佳答案
您可以使用:
1) .hover() 在您的鼠标进入和离开元素时进行处理。
2) .next() 查找元素的下一个直接兄弟。
3) .fadeToggle() 在淡入和淡出之间切换
$(".cover").hover(function(){
$(this).next().stop().fadeToggle();
});
关于javascript - 鼠标悬停在图片上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22526418/