触发同位素重新布局的内容交换JS

我有这个简单的内容交换脚本：触发同位素重新布局的内容交换JS

$(function(){ 

function contentSwitcher(settings){ 
    var settings = { 
     contentClass : '.project-view', 
     navigationId : '#projects-nav' 
    }; 

    //Hide all of the content except the first one on the nav 
    $(settings.contentClass).not(':first').hide(); 
    $(settings.navigationId).find('li:first').addClass('active'); 

    //onClick set the active state, 
    //hide the content panels and show the correct one 
    $(settings.navigationId).find('a').click(function(e){ 
     var contentToShow = $(this).attr('href'); 
     contentToShow = $(contentToShow); 

     //dissable normal link behaviour 
     e.preventDefault(); 

     //set the proper active class for active state css 
     $(settings.navigationId).find('li').removeClass('active'); 
     $(this).parent('li').addClass('active'); 

     //hide the old content and show the new 
     $(settings.contentClass).hide(); 
     contentToShow.show(); 

     $container.isotope('reLayout'); 

    }); 
} 
contentSwitcher();

}）;

我试图在它

$container.isotope('reLayout');

添加一个触发器同位素重新布局，但我似乎无法得到它的触发。初始标签加载正常，但第二个标签全部折叠。我究竟做错了什么？

来源

2016-03-08 Paul Burnhill

什么版本的同位素您使用的是。或者，您可以使用append方法将您的项目添加到您的容器中：http://isotope.metafizzy.co/methods.html#appended –

一个的jsfiddle将有助于解决问题。看起来您可能正在使用已弃用的同位素功能 - 新版本的同位素将“reLayout”选项更改为“布局”。尝试改变

$container.isotope('reLayout');

...到...

$container.isotope('layout');

来源

2016-05-19 08:35:12 Deborah

触发同位素重新布局的内容交换JS

回答

相关问题