2013-07-30 4 views
0

У меня есть следующий код (on jsfiddle here)Jquery код не работает на Firefox/т

$(function(){ 

    var $container = $('#gallery'); 
    $container.isotope({ 
     filter: '*', 
     animationOptions: { 
      duration: 750, 
      easing: 'linear', 
      queue: false 
     } 
    }); 

    var $optionSets = $('ul.nav'), 
     $optionLinks = $optionSets.find('a'); 

    $optionLinks.click(function() { 
     var $this = $(this); 
     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 
      // i.e. 'filter=.inner-transition' -> { filter: '.inner-transition' } 
      option = $.deparam(href, true); 
     // set hash, triggers hashchange on window 
     $.bbq.pushState(option); 
     return false; 
    }); 

    //just a function to quickly add and remove .selected 
    function changeSelectedLink($elem) { 


     $elem.addClass('selected'); 
    } 

    $(window).bind('hashchange', function (event) { 
     //checks if there is a hash in the url and puts hashes in hashOptions 
          $(".selected").removeClass("selected"); 

     var hashOptions = window.location.hash ? $.deparam.fragment(window.location.hash, true) : {}, options = $.extend({}, hashOptions); 
     $('#gallery').isotope(options); 
     var hrefObj, hrefValue, $selectedLink; 
     //go over each hashOption and convert it to a variable 

     for (var key in options) { 
      hrefObj = {}; 
      hrefObj[key] = options[key]; 
      hrefValue = $.param(hrefObj); 
      $selectedLink = $('ul.nav').find('a[href="#' + hrefValue + '"]'); 
      changeSelectedLink($selectedLink); 
     } 
    }).trigger('hashchange'); //this continues the hashchange event 
}); 

Этот код хорошо работает на хроме. Но в firefox 22 и т. Д. 10 он ведет себя странно

При нажатии на цвета все работает. При возврате код должен вести себя таким образом, чтобы .selected был очищен и добавлен только к правильному узлу. Результатом является то, что .selected очищается в DOM (если я проверяю элемент), но на экране это не так. Класс удаляется, как только я нажимаю в любом месте экрана.

Кроме того, если я отлаживаюсь с firebug и т. Д., Этого не происходит!

Я ничего не пропустил в коде?

+0

Я не могу понять, какая часть не работает, на щелкая названия цветов соответствующие флажки (хороший эффект перехода btw), остальные исчезают, это желаемый эффект? отлично работает в моем firefox 22.0! – rps

+0

при нажатии на цвета он отлично работает. Проблема возникает при нажатии кнопки «Назад». Вы должны вернуться к предыдущему цвету. Но 2 цвета отмечены '.selected'. –

+0

Прошу прощения, если мне не хватает _obvious_ в этой скрипке, но я не вижу кнопки _back button_ – rps

ответ

1

удалить a:focus в CSS или добавить blur к $('.selected').removeClass('selected').blur(); в hashchange

http://jsfiddle.net/Q6SbU/7/

есть только один .selected

Смежные вопросы