这是为了在网格和 ListView 之间切换以显示内容。如何在网格和 ListView 之间切换时添加淡入和淡出过渡或不透明度。
这是 Fiddle:http://jsfiddle.net/9B4Lp/3/
(演示,无转换)
来自 Fiddle 的 JS:
jQuery(document).ready(function () {
var $box=jQuery(".post"),
$bar=jQuery("a.bar_view");
$dat=jQuery("a.dat_view");
$dat.click(function () {
$box.removeClass("bar");
jQuery(this).addClass("active");
$bar.removeClass("active");
jQuery.cookie("dat_style", 0);
return false
});
$bar.click(function () {
$box.addClass("bar");
jQuery(this).addClass("active");
$dat.removeClass("active");
jQuery.cookie("dat_style", 1);
return false
});
if(jQuery.cookie("dat_style")==0) {
$box.removeClass( "bar");
$dat.addClass("active")
} else {
$box.addClass("bar");
$bar.addClass("active")
}
});
我试过:当我添加
.fadeOut(1000)
到这里 $box.removeClass("bar").fadeOut(1000);
和.fadeIn(1000)
到这里$box.addClass("bar").fadeIn(1000);
它仅淡入 GridView ,然后 ListView 在淡出时不可见。
查看这个 Fiddle:http://jsfiddle.net/Qba5n/
(问题演示)
请建议如何在切换时在网格/列表之间进行淡入和淡出过渡?
注意:请不要更改 HTML,不要提供任何其他 HTML/插件链接。
谢谢:)
最佳答案
我已经更新了一些代码。我相信这就是你想要的..
更新代码:
$box.fadeOut(1000,function(){
$box.removeClass("bar").fadeIn()//updated
});
$box.fadeOut(1000,function(){
$box.addClass("bar").fadeIn()//updated
});
关于javascript - 网格/ ListView 之间的淡入和淡出如何过渡?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24948429/