0

I want to have possibility to click on link inside iframe and be able to do any mouse action near button but still inside iframe.

When I add pointer-events: none; to whole iframe and try ignore that by setting pointer-events: all; to button (I'm able to edit iframe source) it still looks like this rule isn't accepted.

Does anyone have idea is it even possible? Size of iframe have to be bigger since after button click content will change and element above button will appear.

Here is link: https://jsfiddle.net/fnv4vct6/2/

WooCaSh
  • 5,180
  • 5
  • 36
  • 54

1 Answers1

0

Try this:

iframe {
  position: fixed;
  bottom: 0;
  right: 0;
  border: 1px solid #000;
  pointer-events: all;
  height: 400px;
}

iframe > * {
  pointer-events: none;
}

How can you make an iframe have pointer-events: none; but not on a div inside that?

Luke Ramsden
  • 704
  • 4
  • 15
  • After that I'm able to click on button but not mark text behind the iframe. – WooCaSh May 17 '18 at 12:10
  • 1
    So you want to be able to click through the iframe, but also click the button? I'm fairly sure that's not possible, because if you let the iframe get pointer events (which you have to to be able to click the button) then you won't be able to click behind it. Maybe somebody else knows how. – Luke Ramsden May 17 '18 at 12:14