Cannot stop CSS animations, despite removing the CSS!

[dmuller]

Hi, this is a weird one. I used the animate.css library to add some motion to the page, this worked without issue. I then ran into problems with the page refusing to save, so removed the CSS just in case.

Now the animations continue despite the removal of any CSS, also the page fails to save on occasion, I figure something has corrupted in Pro, but can’t workout what, not wanting to rebuild the page from scratch I wondered whether someone could have a look and see what has corrupted in Pro and how to save/ reset it?

There’s no caching plugin in use.

[dmuller]

Okay, I’ve managed to stop the animations, but only after going into every instance (headline, image etc.) and deleting the CSS class, this despite having deleted the CSS from the page. Somehow the page has cached the CSS and kept it running despite it having been deleted entirely. This is post recent update so perhaps a bug?

If I delete the class on the item/object the CSS stops, then if I reintroduce it (paste it back into the class tag on customize) the animation won’t run as expected. So, despite deleting ALL the PAGE CSS the CSS is only deleted once the object CLASS tags are deleted in the CUSTOMIZE option. Very weird.

[friech]

Hi There,

Thank you for writing in, I see that you have W3 Total Cache deactivated, did you CLEAR that before you deactivated? If not, please activate that back and CLEAR it.

Is this the CSS that you’re referring to?

I am still seeing it on your page CSS, please clarify.

Cheers!

[dmuller]

Hello Friech, no this is a small piece of CSS added after removing everything else, just to test this effect. I’ve since removed it, the original CSS was very long (see the animate.css here: https://daneden.github.io/animate.css/) - it’s very long.

The W3 cache is installed but never activated, so unlikely to be an issue with a previously cached page throwing up errors. It seems to me that somehow the X Pro was creating an internal cache of the CSS. As I said, until I deleted the class css on the item (customize) the effect continued to run. Once deleted the effect stopped and then if I replaced the css it had no effect ( as you would expect if the page css had been removed) - hence my belief that Pro was caching the page css someplace.

I can try and add the css again to see if I can recreate the issue?

[rad]

Hi @dmuller,

It’s not due to added CSS but plugin, It’s called Animate It plugin, try visiting the URL in the secure note and compare it in the CSS here,

https://raw.githubusercontent.com/daneden/animate.css/master/animate.css (from https://daneden.github.io/animate.css/)

They are the same, please deactivate that plugin.

Thanks!

[dmuller]

Hi Rad, this is incorrect. I deleted the CSS entirely. I then removed all the classes form the elements to stop the animation. Since the last message from you guys I ADDED the Animate It! plugin (I want the animations!) - this works fine. I can stop the animations by simply deactivating the plugin.

So, there is only one version of the animate css in action at present, that is the Animate Plugin only.

However, I still have the initial fail to save problem (even with the plugin deactivated) without the never ending animations. I’m sure there is a conflict here somewhere, I’m just not sure where.

As it stands there is 1). NO css on the page 2). Only the deactivated Animate It! plugin 3). Classes added to elements (but as the plugin is deactivated there is no animation) 4). No caching plugin or cached pages.

I’m still getting a fail to save page error. I don’t want to have to delete all the classes I added to elements again (it takes ages). So, any idea why I’m still getting the fail to save error even though I can now start and stop the animations simply by deactivating the plugin?

[dmuller]

I think I may have worked this one out; X Pro doesn;t play nicely with the WP Google Maps Pro Plugin. If activated I can;t save the page. Is there a ‘fix’ for this as I need to use the Map feature, integral part of the site - maybe a jQuery conflict?

EDIT - oddly, disabling the Animate It! plugin only disables some of the animations, not all. Does X Pro and X include some of these in it’s library (for instance the slide in animations for sections might utilise the same class names?).

[ruenel]

Hello There,

Thanks for writing in!

1.) The WP Google Maps Pro should work without issue in X and Pro theme. I have logged in and tested this in your site. I did not encounter any issues at all. Please check the map in your test page.

2.) Yes we do have some animations in X and Pro theme. That is to animate the columns and other elements.
When using your animated css, please do not add infinite in the class field because infinite will mean that the animation will play infinitely.

Hope this helps.

[dmuller]

I think you may be missing the point here, though I appreciate the attempted advice. Some of the animations I want to run continuously, so infinite is the correct class to use.

The issues are with X Pro, and perhaps a plugin ( WP Google Maps or the Animate It! plugin) - logged in today and I can’t edit anything with Pro (blank screen) and things are running very slowly - equally, this could perhaps be an issue with the host (although I haven’t checked with them yet). Pro does seem to not want to play nicely with either of the plugins above.

Is there a conflict you guys can see?

[rad]

Hi @dmuller,

As for clarification, the animation is still there since Animate It plugin is installed with the same CSS that you added that you said, you already removed. It’s not connected to any other issue, it’s just about the CSS that you added and you expect it to be gone since it was deleted.

It’s not related to saving problem or similar, and yes, it sounds a performance issue of your host environment since it vary. Are you on shared hosting? Please contact your host to increase your allocated memory or do it yourself by adding this code in your wp-config.php

define( 'WP_MEMORY_LIMIT', '256M' );
define( 'WP_MAX_MEMORY_LIMIT', '512M' );

Thanks.

[dmuller]

Thanks, I’m not sure this is the issue. There is something amiss with Pro itself. I have disabled all plugins today to try and add in a ninja form. I deactivate ALL third party plugins; the page will save. I activate JUST ninja forms, the page will save, I try and drop in the ninja form shortcode and the page fails to save. This seems to happen with any plugin I activate. If I turn on the WP Google Maps plugin the page won’t save. If I activate just the animate plugin the page, yet again, refuses to save.

Please login using details above again and see for yourself. Try adding the contact form to the main page (not TEST) and saving. It won’t let you.

EDIT: updated the php memory limit, not that I think that’s an issue. If I add in the shortcode without activating the plugin I can save the page, then go back and activate the plugin and I can save the page. However, now the front end is borked. Images won’t display, plugins won;t work. I’m going to try developing locally as this may be an issue with the host. Need to rule that out.

EDIT x2: Yup, I reckon this is a hosting issue. Just installed with MAMP locally and everything appears to work okay (for now), will post back if there are further issues. I guess a new host is required.

[jade]

Thanks for updating. Feel free to let us know how it goes.

[dmuller]

It works, there is a slight delay in being able to save when making changes to the page, it gives the Uh-Oh error dialogue if trying to save too quickly. Otherwise it saves okay even with plugins active. So I would say 95% sure it’s a hosting issue. Thanks for the support.

[Prasant]

Hello @dmuller,

Yes, you can get in touch with the Hosting Provider and it’s support team and see how it goes.

Thanks.