这是我的代码 http://jsfiddle.net/AB6J3/7/ 可以查看、编辑等
当我滚动到红色边框框时,橙色框应该向上滑动,在鼠标移开时它应该向下滑动。它适用于另一种方式,但是当我将 slideDown 更改为 slideUp 时,它不起作用:/我错过了什么?
感谢帮助。
<!DOCTYPE html>
<html>
<head>
<style>
div#monster { background:#de9a44; margin:3px; width:80px; height:40px; display:none; float:left; position:absolute; right:10px; top:0; }
#clickk {width:40px; height:40px; background:#ccc; position:absolute; top:0; right:10px;}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<div style="width:550px; padding:40px 0 0;margin:0 auto; border:1px solid #111; position:relative;">
<div id="monster"></div>
<div id="clickk"></div><br />
<div style="width:500px; height:300px; background-color:#ccc; margin:0 auto;"></div>
</div>
<script>
$("#clickk").hover(function () {
if ($("#monster").is(":hidden")) {
$("#monster").slideDown("fast");
} else {
$("#monster").slideUp("fast");
}
});
</script>
</body>
</html>
最佳答案
我认为你最好在此处进行一些 CSS 调整,如下所示:
#monster {
background:#de9a44;
width:80px;
height:60px;
display:none;
position:absolute;
left: 0;
bottom: 0;
}
#clickk {
width:80px;
height:60px;
border:1px solid #cc0001;
background:transparent;
position:absolute;
top:0;
right:10px;
}
然后像这样的 jQuery:
$("#clickk").hover(function () {
$("#monster").slideToggle("fast");
});
关于Jquery 鼠标悬停在 div slideUp 上,鼠标移出 div slideDown,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3654829/