0

The below script doesn't fire when visiting the page using the back button on browsers. Is there a way to have it fire regardless of how the page is accessed?

window.onload = function() {
    var quotes = $(".head-banner");
    var quoteIndex = -1;
    function showNextQuote() {
        ++quoteIndex;
        quotes.eq(quoteIndex % quotes.length).fadeIn(1500).delay(4500).fadeOut(1500, showNextQuote);
    }
    showNextQuote();
}();
/* Background Transitions */
window.onload = function() {
  var images = ["https://unsplash.it/1800/1600?image=1006", "https://unsplash.it/1800/1600?image=1008"];
  var imageIndex = -1;
    function showNextImage() {
        ++imageIndex;
        var imgUrl = images[imageIndex % images.length];
        $('#header').css('background-image', 'url(' + imgUrl + ')');
        $('#header').fadeIn(1500).delay(4500).fadeOut(1500, showNextImage);
    }
    showNextImage();
}();

edit: since posting this I have learned what a carousel is

Joe
  • 442
  • 5
  • 18
  • What do you mean "doesn't work as expected"? Are the `window.onload()` functions not running at all? – D Vorona Apr 29 '17 at 00:13
  • @DVorona, I should've clarified. I'm sure everything works as it's supposed to, I just don't know why things get messed up when you refresh while on the page or navigate back. Should I wrap the function in another event? or don't wrap at all? – Joe Apr 29 '17 at 00:15
  • 1
    Browser behave differently when navigating back. Sometimes they just use the cached content, and they don't run the `onload` function. Sometimes they refresh the page and they run the `onload` function. – Barmar Apr 29 '17 at 00:17
  • Take a look at this [stackoverflow post](http://stackoverflow.com/questions/158319/is-there-a-cross-browser-onload-event-when-clicking-the-back-button). Explains a bit about why the back button is different than reloading the page and how to deal with it with jquery. – D Vorona Apr 29 '17 at 00:21

0 Answers0