Massonry gallery not loading properly

Hey Vojtech,

I checked in Chrome, Opera and Firefox, but I can’t reproduce the problem on my end. The images loads a bit slow sometimes, but they eventually show up every time. Do you have a sure way of reproducing the results you are seeing on your end?

Best regards,
Rikard

Hi Vojtech,

Thanks for that. I see basically the same thing as on your end, but it actually loads after a few seconds on my end. It looks like you have selected for the element to animate in the element options? If so, then please try turning that off, to see if that makes any difference. Also try to optimise your images as much as possible, as it seems like the delay on my end is due to the images being a bit heavy.

If you need further help, then please post admin WordPress login details in private, so that we can have a closer look at your site.

Best regards,
Rikard

Hi,

Thanks for the update. I tried deactivating the animations, but I get the same results on unfortunately. It doesn’t load until the section is scrolled past, which is a bit strange.

Could you try updating the theme to the latest version (4.8.2) to see if that helps please? https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#theme-update. If not, then I’ll ask the rest of the team to have a look as well, since I can’t see what is going wrong unfortunately.

Best regards,
Rikard

Hi,

This issue usually happens when the masonry element or any element with animation that depends on the waypoint script is inserted at the very bottom of the page. Temporary workaround is to insert another element below the very last element in the page to make sure that there are enough scrollable room for waypoint. Another is to adjust waypoint’s offset parameter.

In the enfold\js\shortcodes.js, look for this function.

	function activate_waypoints(container)
	{
		//activates simple css animations of the content once the user scrolls to an elements
		if($.fn.avia_waypoints)
		{
			if(typeof container == 'undefined'){ container = 'body';};

			$('.avia_animate_when_visible', container).avia_waypoints();
			$('.avia_animate_when_almost_visible', container).avia_waypoints({ offset: '80%'});

			if(container == 'body') container = '.avia_desktop body';
			$('.av-animated-generic', container).avia_waypoints({ offset: '95%'});
		}
	}

Decrease the offset value to 30% or lower to trigger the animation earlier or once the element is positioned
about 30% from the top of the viewport. Please toggle or temporarily disable the Enfold > Performance > File Compression settings after adjusting the parameter.

Best regards,
Ismael