Image defer not always working in mobile view

Also the same problem occurs for next gen image formats

Had a look; this concerns 2 images (front-page-image-teacher-with-kids.png and front-page-image-teacher-with-kids-mobile.jpg) which are both set in CSS in a style tag (<style data-type=vc_shortcodes-custom-css> specifically) and lazyload (and next gen images, which depends on lazyload) does not work on background-images that are added in CSS I’m afraid.

hope this clarifies,
frank

Thanks for the speedy reply – what might be a better way to add the images? In HTML?
TIA

for current version of AO; indeed inside an <img tag

AO 2.6 (beta zip here) will also act on a node (typically <div) with a style attribute that sets a background-image (as a lot of pagebuilders do it that way).

But both the image for desktop and mobile have been added with CSS but image defer works on desktop view and the google speed report says 14 images haven’t been deferred on mobile view – when by your above diagnosis it should be just one right?

that’s weird; when I test only one image is singled out;

GPSI can be .. confused sometimes ??