Good morning all. I'm looking for options to reduce load time on a photo gallery on the index page that contains many photos. It's not an option for me to reduce the number of photos, or reduce the quality. So I'm curious of ways to preload the images differently, only load the first image and then preload the others before the slideshow gets started.
OR/AND how can I add a loading icon on the page that displays while the photos preload? For instance a moving circle that shows % complete ... or just simply a moving circle loading.
Here's the site: www.hayleyhendrix.com
Thank you in advance for your help!!
@eric, thank you very much. Is possible with the above code you posted, to have the loading icon positioned center in the middle of my content DIV? Thank you!
@eric, with the above code, when you show the JavaScript that needs to be copied and pasted below the .gif... Is that the entire code, or does there need to be some sort of Java open and end tag? Thank you.
I'm missing something sir. I pasted the exact JS you provided, directly after the end tag of the HTML and, all that JS script showed up as text on the page. I missed something.
Good morning all. I'm looking for options to reduce load time on a photo gallery on the index page that contains many photos. It's not an option for me to reduce the number of photos, or reduce the quality. So I'm curious of ways to preload the images differently, only load the first image and then preload the others before the slideshow gets started.
OR/AND how can I add a loading icon on the page that displays while the photos preload? For instance a moving circle that shows % complete ... or just simply a moving circle loading.
Here's the site: www.hayleyhendrix.com Thank you in advance for your help!!
I had the same prob. 100 optimized images. I AP'd it to the bottom so my page looked like it loaded fast. Then you can add the loading gif like this http://www.visibilityinherit.com/code/loading-gif.php
And positioned it to the top were I wanted it
@eric, thank you very much. Is possible with the above code you posted, to have the loading icon positioned center in the middle of my content DIV? Thank you!
Your welcome :) of course position it there via position absolute.
@eric, with the above code, when you show the JavaScript that needs to be copied and pasted below the .gif... Is that the entire code, or does there need to be some sort of Java open and end tag? Thank you.
And, I simply paste that Java Script code directly after the end tag > of the HTML code provide, correct?
I'm missing something sir. I pasted the exact JS you provided, directly after the end tag of the HTML and, all that JS script showed up as text on the page. I missed something.
When that happens to me I copy the exact demo. Have it working locally. And find my error
I'm a css fucking guro. But I still have to stare at my computer dumb founded all the time. Find the error
I found the error. There was no open/close HTML tag initiating/ending the Java Script.
Thank you, @Eric, it now works.