I make a function to handle css3 animate:
function play( $elm, animateClasss ) {
$elm.addClass( animateClasss ).one(
'webkitAnimationEnd animationend',
function( evt ) {
if ( evt.target === $elm.get(0) ) {
// here is the right target elment
}
else {
// here, the evt.target sometimes will be another elment which is like:
// '<div class="anotherAnimateClasss"></div>'
// .anotherAnimateClasss not use the `play` function
}
}
);
}
For example, when I use play($('#a'), 'fadeIn')
and handle another element '' by use $('.b').addClass('fadeOut')
, these two ways could make the $('#a')
trigger chaos, sometime triggers fadeIn
, sometime triggers fadeOut
.
Last, what I want to known is that: I addEvent
on $elm
, but why the callback sometimes triggered in another element?