Question

我有一种情况，当点击一个按钮时，我正在淡化某个类的div。例如，如果有人要点击＆＃34;隐藏红色，＆＃34;我使用jQuery来隐藏所有的div，其中包含一个＆＃34; red。＆＃34;这些div向左浮动，宽度为33％。当红色被隐藏时，另一个div与班级＆＃34;蓝色＆＃34;填补＆＃34;红色＆＃34;的空间那些刚刚消失的div。这就是我想要发生的事情，但我希望剩余的div能够顺利过渡到缺失的空间而不是＆＃34;跳跃＆＃34;填补缺失的空间。有没有办法用jQuery做到这一点？

以下是我要做的就是淡出div：

JAVASCRIPT

$(".hide_red").click(function(){
  $(".red").fadeOut();
})

以下是格式化框的方式：

CSS

.box {
  float:left;
  width: 33%;
  height: 80px;
}

Here是一个示例的链接。

Answer 1

尝试使用2500设置"easing"至"linear"，$(".show_all").click(function(){ $(".red, .blue").fadeIn(1000); }) $(".hide_red, .hide_blue").click(function(){ $("." + this.className.split("_")[1]) .animate({ width:"toggle", opacity:"toggle" }, 2500, "linear"); })至{{1}}

{{1}}

codepen here

从页面中删除其他元素后动画浮动元素

1 个答案: