具有BBQ哈希历史记录的jQuery同位素 – 单击后退按钮时突出显示活动类别链接

我有一个简单的测试页面使用优秀的Isotope和BBQ jQuery插件。

两个插件的组合效果很好,但我无法弄清楚如何在单击后退按钮时突出显示活动类别链接。

这是我的HTML:

 

这是我的脚本:

 $(document).ready(function(){ // cache container var $container = $('#gallery'); // initialize isotope $container.isotope({ // options filter: '*', animationOptions: { duration: 750, easing: 'linear', queue: false } }); // FILTER $('ul.nav a').click(function(){ var selector = $(this).attr('data-filter'); $container.isotope({ filter: selector }); return false; }); // HIGHLIGHT SELECTED MENU ITEM var $optionSets = $('ul.nav'), $optionLinks = $optionSets.find('a'); $optionLinks.click(function(){ var $this = $(this); // don't proceed if already selected if ( $this.hasClass('selected') ) { return false; } var $optionSet = $this.parents('ul.nav'); $optionSet.find('.selected').removeClass('selected'); $this.addClass('selected'); }); // HASH HISTORY WITH JQUERY BBQ $('ul.nav a').click(function(){ // get href attr, remove leading # var href = $(this).attr('href').replace( /^#/, '' ), // convert href into object // ie 'filter=.inner-transition' -> { filter: '.inner-transition' } option = $.deparam( href, true ); // set hash, triggers hashchange on window $.bbq.pushState( option ); return false; }); $(window).bind( 'hashchange', function( event ){ // get options object from hash var hashOptions = $.deparam.fragment(); // apply options from hash $container.isotope( hashOptions ); }) // trigger hashchange to capture any hash data on init .trigger('hashchange'); }); 

任何帮助,将不胜感激 ???

我认为解决方案并不难,因为HTML代码和Isotope选项非常简单,但我不是网站管理员。

干杯