Image still loading after loader clears

  • Resolved grozen

    (@grozen)


    9 years, 4 months ago

    Hello there,

    Your plugin seemed perfect for my purposes, which is hiding the chunky loading of an unfortunately large background image on my pages.

    The problem is that when using the plugin it reaches 100% and disappears before said images are done loading (they hardly even begin loading). The images in question are CSS background images if that matters.

    I didn’t change anything other than the loading screen’s color after installing the plugin and was hoping for a quick win. How can I debug this issue?

    Thanks,
    Guy

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author codepeople

    (@codepeople)

    9 years, 4 months ago

    Hello,

    Please, be sure the CSS rules with the background images are not being assigned to the fields at runtime, in whose case the images are not in queue when our plugin estimates the resources that are being loaded. Furthermore, please, be sure is unticked the checkbox: “Disable the search in deep”, in the settings page of the plugin.

    Best regards.

    Thread Starter grozen

    (@grozen)

    9 years, 4 months ago

    Thanks for the quick reply!
    Unfortunately, your suggestions did not seem to help. The background image used to be set using an inline style attribute on the relevant div, so just to be sure I moved it and it’s now set using CSS. Also “Disable the search in deep” is unchecked. The behavior remains the same.

    The site in question is http://www.klarnaisrael.com/, and the image in question is the one you see in the background when the site loads up. I’ve currently disabled the plugin, but I’ll gladly turn it on if that helps you help me (for which I am extremely grateful).

    Sincerely,
    Guy

    • This reply was modified 9 years, 4 months ago by grozen.
    Plugin Author codepeople

    (@codepeople)

    9 years, 4 months ago

    Hello Guy,

    Yes, please, activate the plugin, and let me know. If you have a website for development, I can check the plugin in this website instead the production website.

    Best regards.

    Thread Starter grozen

    (@grozen)

    9 years, 4 months ago

    Much appreciated. The site doesn’t receive too much traffic, so I’ll just go ahead and turn the plugin even though it looks a little strange.

    It’s done. Thanks again for taking the time to help me sort this out.

    Kindly,
    Guy

    Plugin Author codepeople

    (@codepeople)

    9 years, 4 months ago

    Hello,

    Could you try a little change while I check the page structure and plugin’s code, please?

    Insert at the end of the webpage a hidden image tag with the image used as background, as follows:

    <img src="http://www.klarnaisrael.com/wp-content/uploads/2016/07/titlev3.jpg" style="display:none;" />

    Best regards.

    Thread Starter grozen

    (@grozen)

    9 years, 4 months ago

    This definitely helped, but now there’s a different, lesser problem.

    What happen now is that the progress bar just sits at 0% until the image is loaded and then immediately jumps to 100%. This time, however, everything appears to be properly loaded once the loader goes away.

    Is this the expected behavior, or can I improve it further still?

    Much obliged,
    Guy

    Plugin Author codepeople

    (@codepeople)

    9 years, 4 months ago

    Hello,

    The issue is caused because the plugin is detecting only one of images in your web page, please, insert an image tag for each background image in the webpage, as follows:

    <img src="http://www.klarnaisrael.com/wp-content/uploads/2016/07/titlev3.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/06/emil2.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/03/3.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/07/new_appness.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/03/6.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/03/5.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/05/kickoff.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/03/9.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/05/railsgirls.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/03/8.jpg" style="display:none;" />
<img src="http://www.klarnaisrael.com/wp-content/uploads/2016/05/Patchuli.jpg" style="display:none;" />

    Best regards.

    Thread Starter grozen

    (@grozen)

    9 years, 4 months ago

    Didn’t see this response for some reason.
    I’ll definitely give it a go and see how this works. Thanks for taking the time to help me out with this!

    Thread Starter grozen

    (@grozen)

    9 years, 4 months ago

    That definitely did the trick (though I went for something just slightly more maintainable in case I add/change images).

    I would like to thank you profusely.

    Plugin Author codepeople

    (@codepeople)

    9 years, 4 months ago

    Hello,

    I’m working in an update to use the plugin in pages with structures similar to yours, but without the trick of images tags.

    Best regards.

    Plugin Author codepeople

    (@codepeople)

    9 years, 4 months ago

    Hello @grozen,

    I’ve published an update of the plugin where you don’t need create the additional images’ tags.

    Best regards.

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Image still loading after loader clears’ is closed to new replies.