Pointer-events: none on embed / object in and due to iframe browser inconsistencies

I need to have event pointers: none of the videos on YouTube to allow a click on the parent div. The inability to interact with the video requires behavior. Check jsfiddle:

http://jsfiddle.net/annam/ZrCkR/1/

.test iframe, .test object, .test embed { pointer-events: none; } 

The first test, using the iframe option, works fine on firefox, but the event is not triggered on chrome. It seems that most iframes really respect event pointers: no, everything except the embed object itself, which, although on a click, the video does not start playing, it absorbs mouse events. In the real scenario, there is also a parent div draggable, and in chrome, when you first click, the video starts to drag and drop, without the ability to stop.

The second test case, using the old embed code, works fine on chrome, triggering an event, but on firefox it looks like event pointers: nobody is there, and the video is fully interacting.

The same thing happens with vimeo video, so this seems to be typical browser behavior for attachments

Any ideas on how to overcome these problems or why do these inconsistencies exist?

+4
source share

Source: https://habr.com/ru/post/1493636/


All Articles