@@ -123,10 +123,23 @@ http://api.jquery.com/one/
123123-->
124124
125125``` javascript
126- $ (' #yourElement' ).one (
127- ' webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend' ,
128- doSomething,
129- );
126+ // See https://github.com/daneden/animate.css/issues/644
127+ var animationEnd = (function (el ) {
128+ var animations = {
129+ animation: ' animationend' ,
130+ OAnimation: ' oAnimationEnd' ,
131+ MozAnimation: ' mozAnimationEnd' ,
132+ WebkitAnimation: ' webkitAnimationEnd' ,
133+ };
134+
135+ for (var t in animations) {
136+ if (el .style [t] !== undefined ) {
137+ return animations[t];
138+ }
139+ }
140+ })(document .createElement (' div' ));
141+
142+ $ (' #yourElement' ).one (animationEnd, doSomething);
130143```
131144
132145[ View a video tutorial] ( https://www.youtube.com/watch?v=CBQGl6zokMs ) on how to use Animate.css with jQuery here.
@@ -138,14 +151,27 @@ You can also extend jQuery to add a function that does it all for you:
138151``` javascript
139152$ .fn .extend ({
140153 animateCss : function (animationName , callback ) {
141- var animationEnd =
142- ' webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend' ;
154+ var animationEnd = (function (el ) {
155+ var animations = {
156+ animation: ' animationend' ,
157+ OAnimation: ' oAnimationEnd' ,
158+ MozAnimation: ' mozAnimationEnd' ,
159+ WebkitAnimation: ' webkitAnimationEnd' ,
160+ };
161+
162+ for (var t in animations) {
163+ if (el .style [t] !== undefined ) {
164+ return animations[t];
165+ }
166+ }
167+ })(document .createElement (' div' ));
168+
143169 this .addClass (' animated ' + animationName).one (animationEnd, function () {
144170 $ (this ).removeClass (' animated ' + animationName);
145- if (callback) {
146- callback ();
147- }
171+
172+ if (typeof callback === ' function' ) callback ();
148173 });
174+
149175 return this ;
150176 },
151177});
0 commit comments