Mobile Menu Lazy Load

Lazy load is broken on my mobile menu. It doesn’t appear to realize the images are in view when you scroll down the whb-mobile-left menu.

I think fixing it is as easy as adding

$(document).trigger(‘wood-images-loaded’);

to the mobile menu open trigger, but I’m not sure where that is.

Thanks,
Joe

Hello,

Please provide the screen showing the problem as well as you site admin access so that we could check

Best Regards

You can see it by visiting https://parisbloom.com on your mobile device or using a small browser window on your computer.

I have added blog posts and Instagram pictures below the menu, notice they do not show until you scroll the main page (not the menu)

I just need an option to manually trigger the lazy load when the menu opens, or a way to prevent lazy loading of the mobile menu items.

We just checked on mobile devices and images are loaded initially. So when we open the mobile menu we see your instagram and blog images.

I’ve added two screen shots. The first shows what I see when opening the mobile menu.

The second shows that the images load after scrolling down the page.

I suspect the mobile menu HTML is far enough down the page that your lazy load script does not see them as in view until scrolling down.

So if you open the menu without scrolling the page at all, it thinks they’re still not in view.

Attachments:

You must be logged in to view attached files.

Second image isn’t loading because it’s too large for your website. I’ll edit this post with a link in a second.

Edit: second image showing that they load after scrolling down the page.

https://photos.app.goo.gl/Gp69zkRTimC9w2Ny9

I forgot to mention, I know it’s lazy load because it works fine when disabled.

Thank you

Try to add the following code snippet to the Custom JS area in Theme Settings to fix this issue.

jQuery('.mobile-nav').scroll(function(e) {
	jQuery(document).trigger('wood-images-loaded');
});

This works perfectly, thank you.

Great, you are welcome.

[Author]

Posts