This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Eli Beitzuri
Posted Jul 14 - Read on Facebook

stopPropagation() + scroll = problems

Nested clickable elements require using event.stopPropagation() to mitigate a click on the child triggering a click event on the parent.

This seems to mess up scrolling interaction.

Is this a bug, or is there a different way that I should be coding this?

Click on the blue card with the button, then click on the button inside the card:

3 Comments

Jonas Treub

That seems to be a bug right Koen Bok?

Koen Bok

This seems like it's behaving ok. But I can see how this is confusing. Click is MouseUp, so the MouseDown starts the dragging, but it never receives MouseUp if you stop propagating, so it get's stuck.

The tough part here is that event bubbling is often reverse to how we want it to be. The easy way to fix it is to use one of the new gesture events (Tap) where I now account for all that: http://share.framerjs.com/qioc7t88ha68/

Koen Bok

If you want to study it in depth: http://www.quirksmode.org/js/events_order.html

The new gesture events use the capture phase.

Read the entire post on Facebook