Question

我已经实现了一个切换视图页面，您可以在列表和网格之间切换切换状态之间的动画有点难看（切换使用顶部的两个链接来查看我的意思）：{{3 }}

要解决此问题，我尝试在切换按钮上应用setTimeout功能，以便我可以首先淡出父div #post-list，然后执行布局更改然后最终淡出{ {1}}再次返回以显示更新的布局。当我实现这个时虽然淡入/淡出有效，但布局没有改变：http://jsfiddle.net/qvLoLhy7/2/

有人可以帮忙找出为什么会发生这种情况吗？

以下是JS的片段：

#post-list

Answer 1

你正在使用jquery但你并没有真正使用jquery。 Jquery附带了一个你可以使用的fadeIn和fadeOut动画。

var $pl = $('#post-list');
$pl.fadeOut('slow', function(){
  //call back when animation is done
  //here you can apply layout changes
  $pl.fadeIn('slow', function(){
     //call back when the fade in animation is done
     //do other stuff here
  });
});

Here是一个基本的例子。

您还应该将代码转换为等效的jquery。

如果您正在寻找，请告诉我。

点击淡出div然后淡入

1 个答案: