Geek asks and answers

Why can a transition event be fired when the transition of children of an element completes a transition?

I associated the event transitionendwith div1. When the transition div1was completed, the event started. No problems.

I came across a special case:

I added 3 paragraphs to this div1, when each paragraph transition ends, an event is also fired div1 transitionend. Thus, the event was transitionendexecuted 4 times ..> & L;

In the div1 transitionendbody of the event listener function, I see that event.target! == this. I feel this is pretty funny!

Chrome and Firefox have this problem. Therefore, I assume that this is not an HTML5 browser error.

Can someone explain why an element transitionendcan also be called by this element of children?

Thank.

+5
source share
1 answer

This is called bubbling events. Many events that occur on a child will by default pop up through their parents after calling the event handler in the original object. You can detect bubbles, as you noticed, while examining an object event, or you can prevent bubbles by stopping propagation when you process an event on the original object.

Stopping distribution is one of those things that differ in IE and other browsers. In other browsers, you call:

event.stopPropagation()

In IE before IE9:

window.event.cancelBubble = true;
+9
source

More articles:


All Articles