Tagged: , , ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • February 5, 2019 at 8:23 am #1063054
    Kahil

    I have been trying several scripts to do this, but nothing is working. I know that there is a bit of lazyload baked into Enfold already, so I’m assuming there’s a conflict I’m not seeing when I try some simple scripts that I know work just fine.

    The reason I want this is that I have put together an element that is animated via CSS only. So no scripts are used. I want to make it so that the element container isn’t loaded until viewed so that when it does come into view, users will see the one-time animation.

    Thoughts?

    February 6, 2019 at 7:55 am #1063492
    Kahil

    I tried injecting the same class that Enfold uses for their delayed animations, but that didn’t work. So I’m guessing there’s a hidden step in there somewhere I’m not seeing.

    avia_start_delayed_animation

    Any help getting this to work would be appreciated. I’m trying to put together more advanced and nice looking custom elements for everyone and I want to be able to tie into what is already baked into the theme as to not double down.

    February 10, 2019 at 12:41 am #1065034
    Mike

    Hi,
    Sorry for the late reply, I searched for the script that delayed the css animation in Enfold, and found it in:
    enfold\js\shortcodes.js
    starting on line 390:

    $.fn.avia_sc_animation_delayed = function(options)
{
	var global_timer = 0,
		delay = options.delay || 50,
		max_timer = 10,
		new_max = setTimeout(function(){ max_timer = 20; }, 500);
	
	return this.each(function()
	{
		var elements = $(this);

		//trigger displaying of thumbnails
		elements.on('avia_start_animation', function()
		{
			var element = $(this);
			 
			if(global_timer < max_timer) global_timer ++;
			
			setTimeout(function()
			{ 
				element.addClass('avia_start_delayed_animation'); 
				if(global_timer > 0) global_timer --; 
			
			}, (global_timer * delay));
			
		});
	});
}

    so reading this it looks like the elements with the class “avia_start_animation” get the class “avia_start_delayed_animation” added to them. I’m not sure if this will help you, but this is where the lazy load is starting in Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.