我正在一个项目上使用jQuery Isotope。
我可以从其他页面上的 href 链接将过滤器值传递给它吗?因此,当我登陆带有同位素的页面时,它会根据 href 过滤布局。
是的。您可以使用 Isotope 的哈希历史插件,它利用了 jQuery BBQ。
此示例只是来自同位素文档上哈希历史记录页面源的复制粘贴。
$(window).bind( 'hashchange', function( event ){
// get options object from hash
var hashOptions = window.location.hash ? $.deparam.fragment( window.location.hash, true ) : {},
// do not animate first call
aniEngine = hashChanged ? 'best-available' : 'none',
// apply defaults where no option was specified
options = $.extend( {}, defaultOptions, hashOptions, { animationEngine: aniEngine } );
// apply options from hash
$container.isotope( options );
// save options
isotopeOptions = hashOptions;
// if option link was not clicked
// then we'll need to update selected links
if ( !isOptionLinkClicked ) {
// iterate over options
var hrefObj, hrefValue, $selectedLink;
for ( var key in options ) {
hrefObj = {};
hrefObj[ key ] = options[ key ];
// convert object into parameter string
// i.e. { filter: '.inner-transition' } -> 'filter=.inner-transition'
hrefValue = $.param( hrefObj );
// get matching link
$selectedLink = $optionSets.find('a[href="#' + hrefValue + '"]');
changeSelectedLink( $selectedLink );
}
}
isOptionLinkClicked = false;
hashChanged = true;
})
// trigger hashchange to capture any hash data on init
.trigger('hashchange');
});