Question

我有以下问题：

使用array[:, [0,1], [1,0]] #array([[112, 121], # [212, 221]])和.show()工具将不同的面板滑入视图中工作良好。然而，正在动画的整个.hide()向下移动了一些动画运行时的像素动画完成后（停止运行），div会快速回到它应该处于的位置。

这是我目前用于从状态A到状态B的动画（幻灯片）的代码：（＆＃39;显示的输入＆＃39;选择＆＃39;选择显示＆＃39;）

div

在我将在问题底部链接的JSFiddle中，您还可以看到我想从状态B返回到状态A的代码。

到目前为止，我已尝试使用$(this).parent().find('#input').hide('slide',{ direction: "right" }, 400, function () { $(this).parent().find('#select').show('slide',{ direction: "left" }, 400, function() { $('#selectLabel').focus(); }); });代替.toggle()和.show()，如下所示：

.hide()

反过来但问题保持不变。

我还尝试在$(this).parent().find('#input').toggle('slide',{ direction: "right" }, 400, function () { $('#selectLabel').focus(); });包裹中添加min-height 500像素，但问题再次保持不变。动画div向下移动并最终重新捕捉。删除课程也没有帮助。

jQuery：bootstrap jquery 1.11.3
jQueryUI：bootstrap jqueryUI 1.11.4
Bootstrap：3.1

我不确定它是否有所作为，但是javascript是从正文内部而不是头部加载的。

正如这里所承诺的那样，链接到JSfiddle：https://jsfiddle.net/tjky76wp/

任何人都知道我做错了什么？如何阻止动画div在动画制作时向上移动？

编辑：
我刚刚意识到我给了你们一个过时的JSFiddle的链接，这里是正确的：https://jsfiddle.net/tjky76wp/1/

Answer 1

好的，所以我发现了一种解决方法，或者更好地说，我找到了一个已经找到解决方法的人。

显然我昨天没有做足够的研究，因为我的问题的答案可以在这里找到：jQuery slideToggle jumps around

对于那些懒得点击的人：
在滑动div上设置'overflow：hidden'（在我的情况下为#input和#select）将使问题消失。

我认为这与动画运行时为div设置的属性有关。

编辑：明天我只能接受我的答案，我将会这样做。

幻灯片动画运行时Div下降

1 个答案: