我有一个css div,在那个div中存在另一个div。当鼠标悬停在父div上时,如何获得子div?在这里:
<div class="parent">
<div class="child">
</div>
</div>
当鼠标越过父div时,我希望显示子div。
答案 0 :(得分:7)
这有效:
$('.child').hide(); // or $('.parent').children().hide();
$('.parent').hover(
function() { $(this).children('div').show() },
function() { $(this).children('div').hide() }
);
http://jsfiddle.net/4kMuD/处的示例,虽然它使用ID而不是选择器的类。
我假设(虽然您没有说)当您不再盘旋在父母身上时,您希望子div再次消失。
答案 1 :(得分:0)
这样的东西?
<div id="div1">
div1
<div id="div2" style="display:none;">div2</div>
</div>
$(function(){
$("#div1").hover(function(){
$("#div2").show();
}, function(){
$("#div2").hide();
});
});
答案 2 :(得分:0)
$('div.parent').bind('hover',
function(e) { $('div.child', this).show() },
function(e) { $('div.child', this).hide() },
);
答案 3 :(得分:0)
<html>
<head>
<title>Tests</title>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$('#parent').mouseover(function() {
$('#child').css('display', 'block');
})
});
</script>
<style>
#parent {width: 100px; height: 100px; background-color: yellow;}
#child { display:none; }
</style>
</head>
<body>
<div id="parent">
<div id="child">Content</div>
</div>
</body>
</html>