Animations broken with FF31 update

[TheDoctor05]

First of all I want to thank you for the development work you have done. This is a great plug-in. I wanted to report that ever since the FF 31 update the animations do not work, you can go from "slide" to "slide" but the animation is broken. I was trying to look to see if i could catch what exactly is causing the problem but i haven't been able to narrow it down. Any help would be appreciated.

thanks,

[TheDoctor05]

After more troubleshooting and review i found out that this line:
transitionProperty:g(f(e("transform")))+g(f(e("perspective")))+"opacity",
in jmpress.min.js was causing the issue because it was creating this css property:
transition-property: --transform, --perspective, opacity;
That apparently FF 31 did not like.

[malzlolli]

Could you please tell me how you fixed it?
Which version of jmpress do you use? I'm using version 0.4.5 (not minified) ...not able to find the line you mentioned above.
Thank you!

[TheDoctor05]

I'm using the same version 0.4.5. I believe the unminiized version of that line of code would be approx line 92:
,transitionProperty: addComma(mapProperty(pfx('transform'))) + addComma(mapProperty(pfx('perspective'))) + 'opacity'

Try that, like I said im not sure why FF31 doesn't like this properties, but it resolved my animations issue.

[malzlolli]

Great! That solved the issue for me too. Thx a lot!

But maybe another browser & specific version or device needs that line of code...

[TheDoctor05]

NP! so far it works on:
chrome : Version 36.0.1985.125 m
FF:31
IE 11
(Cannot confirm on older IE)

[TheDoctor05]

hopefully the developer will read this and may be provide a better backwards compatible solution

[omervk]

The issue here is that Firefox has dropped support for their --moz-* properties, and are instead using the standard ones (--moz-transform is now transform).

The correct fix for this issue is:

1. In the function pfx, change the value of prefixes from 'Webkit Moz O ms Khtml'.split(' ') to ['Webkit','Moz','O','ms','Khtml',''].
2. In the function mapProperty, add the line if (prefix === '') return name; after prefix is set.

This fix will both keep backwards compatibility with older browsers and account for those who are standards-compliant from now on, like FF31+ is.

[sokra]

@omervk Would you like to implement this as PR?

[omervk]

Sure, I'll take a crack at it :)

[ahmetsali]

@omervk thank you for the solution!