Question

I have implemented endless scrolling to my website user account area and before more data is loaded when a user scrolls text is briefly displayed as you can see in the code here:

if ($('.pagination').length) {
  $(window).scroll(function() {
    var url;
    url = $('.pagination .next_page').attr('href');
    if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
      $('.pagination').text("Fetching more products...");
       $.getScript(url);
    }
  });
  $(window).scroll();
};

I have an animated gif image I’d like to display instead and wondering how to go about doing this? Is it possible to link directly to the image?

What is the correct way to display an image instead of text?

Kind regards

Answer 1

Just change the method from text() to html(), something like:

$('.pagination').html('<img src="loading.gif" width="30" height="30" alt="loading..." />');

You can use any form of HTML within the method, so you could wrap the image in a link or whatever.