Question

I’m in the midst of implementing the very excellent Anything Slider plugin by Css Tricks using a number of high res images, which make the page load pretty slow.

Does anyone know how to integrate the Lazy Load plugin to work with Anything Slider?

Answer 1

Ok, Well this isn’t a solution, but I’m posting this for anyone who’s experiencing this same sort of issue.
I wasn’t sure how to control the loading of my gallery images to take place after all other css background images on the page were loaded (e.g site logo, gallery bg, etc.).

For a temporary workaround, and yes, I am aware of the various downfalls, do the following:

• create a div at the top of you html body, and set as display:none.
• insert all of the image assets that were last to load into that div (make sure they have the same path).
• those images will now load onto the page and will gain priority even though they are eventually only being called to display by css

A few things to note:

• If you have a lot of images or
  multiple pages, don’t use this
  method. It’ll be a pain to upkeep as
  you will have to perform image name
  changes numerous times
• I’ve tested as thoroughly as I could and this seems to not affect
  page load speed, but I may be wrong