0

When I click on an a tag it changes a class and delays going to the href location.

Then when you press on the back button (tried on safari and firefox) it returns with the class' "animated" and "bounceOutUp" but I want it to com back with the original class' "animated" and "bounceInDown"

$('a').click(function (e) {
    e.preventDefault();
    var goTo = this.getAttribute("href");
    if ($(this).attr("href").length > 5) {
        $("#logo").removeClass('animated bounceInDown');
        $("#logo").addClass('animated bounceOutUp');
    }
    setTimeout(function () {
        window.location = goTo;
    }, 1000);
});

How can I sort this out?

maxisme
  • 3,974
  • 9
  • 47
  • 97

1 Answers1

0

You have to re-add your initial class $("#logo").addClass('animated bounceInDown'); on page load. This answer provides cross browser method to trigger page load after pressing back button. https://stackoverflow.com/a/201406/3194484

Community
  • 1
  • 1
Rami Enbashi
  • 3,526
  • 1
  • 19
  • 21
  • This works for firefox and chrome. But not safari as it seems to not reload the page at all if you go back once! I don't imagine it is possible to do unless after the timer I add the class back again? – maxisme Jan 18 '14 at 20:25
  • Yeah that would be even cleaner than my solution. You can add the class back just before `window.location = goTo;` – Rami Enbashi Jan 18 '14 at 20:28