Endless scrolling without image loading

I searched everywhere to try to figure out how to use infinite scroll and not have a boot image, but I can't find it. Here's how you downloaded the text and image:

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

if I set msgText to '' then there will be no text, but I can not do the same with the loaded image, as if I set it to an empty line, it will display an image with an error image.

How to use an endless scroll without a boot image?

infinite-scroll

note that the boot image and text are the wrong syntax on this page, you can see the correct syntax here

+4
source share
3 answers

You can use a 1 ร— 1 pixel transparent image with a base of 64:

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

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


Edit : From the smallest size for a transparent single pixel image, you can also use shorter ones

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

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

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

Source: jquery.infinitescroll.js. Inside 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>'); 
+6
source

There is a gif inside the plugin. Either remove loadingImg : "/img/loading.gif", , or replace some empty size.

0
source

Source: https://habr.com/ru/post/1496933/


All Articles