Is there a way to remove animation effects for mobile devices? The animations work great on desktop but on mobile they don’t work smoothly. Elements just pop into the viewport. Any help would be much appreciated.

Aaron

Which ones?
Check the \stylesheets\animations.css file, most are there!

Not sure what you’re asking when you say “Which ones?”. Maybe I didn’t explain what I need properly. I want to disable all animation effects for mobile devices. I want the animation to work on desktop, just not mobile. If that’s possible. Here is a link to the site I’m currently building. As you will see the animation for the contact info is smooth on desktop but on a mobile device it pops into the screen which isn’t a very nice effect for the user and that’s why I would like to remove the effect or fix it if you have a solution.

Thanks,
Aaron

If you want to disable a specific one you can easily wrap it in a conditional like so, from:

// Top Icon Box
$(e).find('.top_icon_box.boc_animate_when_almost_visible:not(.boc_start_animation)').each(function (i, e) {
	var delay = 300,
	stagger = 200 + i*500;

	// Each child
	$(this).children().each(function (i, e) {
		
		if(!$(this).is("a")){
			$(e).trans(i * delay + stagger + 'ms', '-delay');
		}else {
			$(e).children('.icon_holder').trans(i * delay + stagger + 'ms', '-delay');
		}
	});
});	

to:

// Top Icon Box
if(!boc_is_mobile){
$(e).find('.top_icon_box.boc_animate_when_almost_visible:not(.boc_start_animation)').each(function (i, e) {
	var delay = 300,
	stagger = 200 + i*500;

	// Each child
	$(this).children().each(function (i, e) {
		
		if(!$(this).is("a")){
			$(e).trans(i * delay + stagger + 'ms', '-delay');
		}else {
			$(e).children('.icon_holder').trans(i * delay + stagger + 'ms', '-delay');
		}
	});
});
}

Now, if I want to disable the CSS animations, how do I go about doing that?

Thanks,
Aaron

They are disabled by default for devices with resolution below 768px so that should be sufficient for you.

Is there a way I can increase the default disabling size from 768px to a higher value? When I view the site on an iPhone 6 or my Droid Turbo II the animations are not disabled. I assuming that’s because of their a higher resolution than 768px.

Thank you for all your help with this matter!

Aaron

Sure, you can either raise the value in that media query from 769 to a higher value.

Thank you for all of your help!

Aaron