Jquery的效果的slideToggle不流畅

<div class="searchDiv"> 
    <div class="row"></div> 
    <div class="row"></div> 
    <div class="row"></div> 
    <div class="row"></div> 
</div>

我想打电话给$("div.searchDiv").slideToggle("slow");上分度，searchDiv类，它最初是隐藏的使用display:none。这些4 div中的div元素还有row。这些元素放置在主div div searchDiv中的方式是否重要？因为我发现切换效果对于放置在主div内的元素不平滑。Jquery的效果的slideToggle不流畅

来源

2014-04-04 user2585299

你能发布一个完整的代码示例？并且尽可能包含jsFiddle.net示例。 – j08691

如果事情外表光滑与否的想法是一个意见，并根据谁在看它的不同。如果你使用的速度很慢，那么给它一个200毫秒的值。

SlideToggle。 https://api.jquery.com/slideToggle/

延时时间是以毫秒为单位的较高的值表示较慢的动画，而不是较快的动画。可以提供字符串'fast'和'slow'来分别指示200和600毫秒的持续时间。

默认宽松的摆动和对我来说，它看起来粗糙。我会建议尝试线性缓解。

如果摆动或直线是不是你不够顺畅，您可以使用，包括jQuery UI的，并使用其他选项之一。您可以根据需要找到您认为顺畅的缓动。
http://jqueryui.com/resources/demos/effect/easing.html

$('.searchDiv').slideToggle(2000,"linear", function() { 
    // actions to do when animation finish 
});

来源

2014-04-04 20:01:01 donlaur

放置在class =“row”分区内的子元素具有margin-left属性，并且被绝对定位。我将他们的位置改为相对，现在切换效果平稳。尽管智利元素的css不应该影响切换行为。 – user2585299

这不是被接受的答案吗？没有标记。 – donlaur

您需要将宽度添加到您的行。直到它显示

jQuery的不知道你的隐藏div的尺寸。所以当它被点击时，它实际上会将它拉出来以便在快速替换它之前进行测量。这往往有导致一些跳跃的副作用。设置元素的宽度可以防止jQuery将其拉离位置。

来源

2014-06-11 20:11:02

我知道这是旧的，但在情况下，它可以帮助别人，我发现了一个问题，当我的切换元件上设置的最小高度属性设置为解决这对我来说是固定的高度。

来源

2014-10-01 12:15:50 TJ15

我有类似的问题。有两件事为我解决了。

我需要删除我元素上的现有转换CSS。
我有一个元素我的“点击栏”内（H2）在需要边距设置为0（这是使其他元素动画到错误的边界 - 导致在最后一个奇怪的SNAP）

来源

2016-09-29 03:31:22

Jquery的效果的slideToggle不流畅

回答

相关问题