Question

我有一个切换jquery错误，在这里的帮助下，修复了许多错误，但仍然存在一个错误。

当您的鼠标输入“meer informatie”时，孩子div会向下滑动。当您在.panel完成向下滑动之前留下“meer informatie”时，下次您输入“meer informatie”时它将不会向下滑动100％

我得到了第二个问题，但我想我必须在一个新的“提问”中提出这个问题

登台页面的网址：http://staging.skyberate.nl/shared-hosting/magento-hosting/referenties/

我认为这有点像这个问题，但不是真的理解它：P 像这样：jquery toggle sometimes does not work

jquery的：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>

<script>
$(document).ready(function(){ 
$(".flip").mouseenter(function(){
$(this).find(".panel").stop().slideToggle("slow"); 
});
$(".flip").mouseleave(function() {
$(this).find(".panel").stop().slideToggle("slow");
});
}); 
</script>

的CSS：

.flip{
 cursor: pointer;
 background-color:white;
 width:490px;
margin-left: 43px;
color:#1667b2;
text-align:center;
border-bottom: 2px solid #1667b2;
display:block;
}

.panel
{
width:480px;
color:white;
background-color:#1667b2;
float:left;
margin:0px;
display:none;
padding:5px;
}

#meerreferenties {
width:auto;
float:left;
margin-top:10px;
}

和html：

<div class="flip"><p>Meer informatie</p>
<div class="panel"><p>Hier komt de informatie te staan over de desbetreffende hosting.
Hier komt de informatie te staan over de desbetreffende hosting.
Hier komt de informatie te staan over de desbetreffende hosting.
    Hier komt de informatie te staan over de desbetreffende hosting.
Hier komt de informatie te staan over de desbetreffende hosting.
Hier komt de informatie te staan over de desbetreffende hosting.
Hier komt de informatie te staan over de desbetreffende hosting.</p>
</div>
</div>

Answer 1

您可能正在使用旧版本的jQuery（1.7之前），其中stop()函数没有按照您的期望进行操作。 Here you can详细了解jQuery对stop()函数的说法：

从jQuery 1.7 开始，使用.stop（）提前停止切换动画将触发jQuery的内部效果跟踪。在以前版本，在切换动画之前调用.stop（）方法完成会导致动画失去对其状态的跟踪（如果 jumpToEnd是假的）。任何后续动画都将以新的动画开始 “中途”状态，有时导致元素消失。

我可以为您找到两种解决方案：

1 - 将您的jQuery版本更新为1.7或更新版本。

2 - 使用两个真实参数调用这样的停止函数：.stop(true,true)。

$(document).ready(function () {
    $(".flip").mouseenter(function () {
        $(this).find(".panel").stop(true,true).slideToggle("slow");
    });
    $(".flip").mouseleave(function () {
        $(this).find(".panel").stop(true,true).slideToggle("slow");
    });
});

这是DEMO。最重要的信息将是错误的，而最底层的信息将起作用。你可以看到我在这里使用jQuery 1.6。如果你切换到1.7都应该工作。

Jquery切换有时不会出现100％

1 个答案: