jquery - CSS transitionEnd event still listening to finished transition -
i have 2 div elements namely .parentdiv
, .childdiv
i using css transition animate both. .childdiv
should animate opacity first on transitionend, animate .parentdiv
height, call on alert check.
so here code :
$('.childdiv').addclass('faded').on('transitionend', function(){ $('.childdiv').off('transitionend'); $('.parentdiv') .addclass('no-height') .on('transitionend',event, function() { alert(event.propertyname); }); });
problem:
after .addclass('faded')
went on execute second transition (which correct). ontransitionend of .parentdiv
, event.propertyname has been alerted 'opacity' , being fired .childdiv
finishes transition.
i want execute when height has been adjusted. don't wrong, "height" being alerted once height transition finished appears reads other transitions aside height adjustment.
here jsfiddle of : http://jsfiddle.net/e9uwa/
thank help!
simply add event.stoppropagation() in $('.childdiv').on()
since event of childdiv propagate parentdiv