87,904
社区成员
发帖
与我相关
我的任务
分享jquery mouseenter mouseout 多次
下面是自己写的一段代码。
现在遇到一个问题，请求高手的帮助。
如何设置： 在slideUp和slideDown的过程中，mouseenter mouseout无效，只有在完成mouseout的过程后，再次mouseenter，才重新开始新的 slideUp和slideDown。
不要记住所有mouseenter mouseout的总次数，当鼠标快速的反复进出DIV区后，即时鼠标移动出DIV区，也会反复运行slideUp和slideDown，直至完成前面的总次数才停止。 谢谢。
现在遇到一个问题，请求高手的帮助。
如何设置： 在slideUp和slideDown的过程中，mouseenter mouseout无效，只有在完成mouseout的过程后，再次mouseenter，才重新开始新的 slideUp和slideDown。
不要记住所有mouseenter mouseout的总次数，当鼠标快速的反复进出DIV区后，即时鼠标移动出DIV区，也会反复运行slideUp和slideDown，直至完成前面的总次数才停止。 谢谢。
<!DOCTYPE HTML>
<html>
<head>
<title>jQuery SlideDown() / SlideUp()</title>
<style type="text/css">
.text {
float: left;
position: relative;
overflow: hidden;
width:300px;
height:200px;
}
.title {
position: absolute;
top: 0px;
left: 0px;
display: none;
background-color: black;
color: white;
padding: 10px;
width: 100%;
height: 80px;
z-index: 10;
}
</style>
<script type="text/javascript" src="jquery.1.61.js"></script>
<script type="text/javascript">
(function( $ ){
$('.text').live('mouseenter',function() {
$(this).find('.title').slideDown(500);
});
$('.title').live('mouseenter',function() {
$(this).css("display","block");
});
$('.text').live('mouseout',function() {
$(this).find('.title').slideUp(500);
});
})(jQuery);
</script>
</head>
<body>
<div class="text">
Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text. Main text.
<span class="title">title text. title text. title text. title text. title text. title text. title text. title text.</span>
</div>
</body>
</html>
...全文
请发表友善的回复…
发表回复
3colors 2013-08-21
- 打赏
- 举报
嗯，stop就可以了
去圣西罗-为尤文喝彩 2011-08-10
- 打赏
- 举报
解决了，解决方案见：
http://jsfiddle.net/jTRkV/show/
http://jsfiddle.net/jTRkV/show/
sdf282002086 2011-08-09
- 打赏
- 举报
可以通过绑定函数和解除函数试试！
