Preload all images at once
-
@arminunruh thank you, Armin. I pasted this in CSS and unfortunately nothing changed and images keep flicking as I scroll. Do you think there might be another css option? Perhaps there's a way I can implement some kind of smoother appearance? Sort of like a very quick fade out of white or a custom color like here (https://data-orbit.ch).
-
@arminunruh or this: https://www.vrints-kolsteren.com (images load from colors)
-
well usually if you just use lazyload instead of turning it off, it will just fade in the image once you scroll to it…
if you remove this cssimg{
opacity: 1!important;
}ususally i think even with lazyloading turned off, it should fade in.
remove the css above
now use this css:
img{
transition: opacity 300ms ease!important;
}with lazyload still off
-
or this: https://www.vrints-kolsteren.com (images load from colors)
in lay options there is the placeholder color option
if u want to use custom css you can change the color on a per image basis, but yea theres no way to have this automatically
-
@arminunruh hi Armin. Just tried what you suggested:
"remove the css above
now use this css:img{
transition: opacity 300ms ease!important;
}with lazyload still off"
Unfortunately, it only affects the fade duration when you reload the page. It doesn't add the fade on images when you scroll at them, and they load in the same choppy way as before :(
-
ok so then can u just enable lazyloading again
-
@arminunruh did that, and nothing changed. As I mentioned above, it only affects the loading of the whole page when I reload it, but it doesn't change any behavior of the image-by-image loading as I scroll. You can even see it yourself if you try it from the client side. The images load in a choppy way, not in a smooth way. Sorry for bothering but I really would like to solve it.
-
here's a perfect example of the image loading behavior I would like to achieve:
-
sure,
can you send your website address, /wp-admin/ username and password and a link to this topic to info@laytheme.com?
let me look at this more
-
https://www.baenziger-hug.com/
this website has lazyloading and when an image loads it fades in
-
@arminunruh yes, but somehow lay theme's lazyloading doesn't look anywhere close. That website has this smooth appearance. Just sent you the email.
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it