CODEWITHSUNDEEP
javascriptjqueryimageinfinite-scroll
Ryan Saxe
Ryan Saxe

Reputation: 17829

infinite scroll without loading image

I have looked everywhere to try and figure out how to use infinite scroll and not have a loading image, but I cannot find it. This is how you set it up loading text and image:

loading: {
    img: "/img/loading.gif",
    msgText: "Loading new posts..."
}

if i set msgText to '' then there will be no text, yet I cannot seem to do the same with the loading image as if I set it to a blank string, it will display the error image image.

How can I use infinite scroll with no loading image?

infinite-scroll

note that the loading image and text is incorrect syntax on that page, you can see the correct syntax here

Upvotes: 4

Views: 6079

Answers (3)

Geoff
Geoff

Reputation: 76

You're looking for the msg argument, which will ignore img and msgText by the way.

loading :
{
    msg : $('PUT YOUR HTML HERE') // Accepts a jQuery object
}

Source: jquery.infinitescroll.js. Inside of function infscr_create:

// Define loading.msg
opts.loading.msg = opts.loading.msg || $('<div id="infscr-loading"><img alt="Loading..." src="' + opts.loading.img + '" /><div>' + opts.loading.msgText + '</div></div>');

Upvotes: 6

Oriol
Oriol

Reputation: 288100

You could use a base64 encoded 1x1 pixel transparent image:

img: 'data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=='

This way you avoid sending lots of headers to download a tiny image.

Edit: From smallest filesize for transparent single pixel image, you could also use the shorter

img: 'data:image/gif;base64,R0lGODlhAQABAHAAACH5BAUAAAAALAAAAAABAAEAAAICRAEAOw=='

Upvotes: 9

Ali &#199;arık&#231;ıoğlu
Ali &#199;arık&#231;ıoğlu

Reputation: 1305

There is a gif inside the plugin. Either delete loadingImg : "/img/loading.gif", or replace with something blank same size.

Upvotes: 0

Related Questions