JQueryUI 按钮滑动动画不必要地扩展布局

Question

看看这个 jsfiddle

我试图将两个按钮并排放置，其中一个按钮是动态的，并且仅在发生特定事件时才会出现(在示例中是按下另一个按钮)。但在动画转换过程中，布局有点扭曲

$('.btn-toggle').click(function(){
    $('.btn-del').toggle( "slide", {direction: "left" }, 500 );
})

Answer 1

这里发生的是 jquery 动画将一个占位符添加到按钮动画的位置。这是改变切换按钮位置的元素。如果您将动画的速度设置得很慢并查看 HTML 代码，您将能够看到这一点。

这是我用来隐藏占位符的CSS，这样就不会发生这种情况

button.ui-effects-placeholder{
   display: none !important;
}