Question

我想在此脚本中添加淡入和淡出过渡，因此我想在脚本中插入fadeOut(1000) fadeIn(1000)。

这是脚本：

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")
    }
});

这是用于在网格和列表视图之间切换以显示内容的jQuery脚本。这是网站，我在这里实现了这个脚本：http://bbelog-megagrid.blogspot.com查看那里的HTML源代码。

这是添加脚本过渡的相同示例：

$(document).ready(function () {    
var elem=$('ul');      
$('#viewcontrols a').on('click',function(e) {
 if ($(this).hasClass('gridview')) {
  elem.fadeOut(1000, function () {
  elem.removeClass('list').addClass('grid');
  elem.fadeIn(1000);
         });      
 }
 else if($(this).hasClass('listview')) {
  elem.fadeOut(1000, function () {
  elem.removeClass('grid').addClass('list');
  elem.fadeIn(1000);
        });         
 }
});
});

我想像这样修改第一个脚本。

Answer 1

你可以添加这样的

$dat.click(function () {
        $box.removeClass("bar");
        jQuery(this).addClass("active");
        $bar.removeClass("active"); 

        $bar.fadeOut(1000);
        $dat.fadeIn(1000);

        jQuery.cookie("dat_style", 0);
        return false
    });
    $bar.click(function () {
        $box.addClass("bar");
        jQuery(this).addClass("active");
        $dat.removeClass("active");

        $dat.fadeOut(1000);
        $bar.fadeIn(1000);
        jQuery.cookie("dat_style", 1);
        return false
    });

我如何在这个jquery脚本中插入其他字符串？

1 个答案: