Это действительно сложно. Кажется, что нет решения, учитывая следующие требования.
Это происходит из-за того, что:
Учитывая эти ограничения, можно реализовать решение, которое объединяет - страницу Visibility API - размытие / фокус окна - document.activeElement
Это может:
Когда фокус iframe имеет фокус, ваши события размытия / фокуса вообще не вызываются, а страница Visibility API выиграла ' t на вкладке alt +.
Я построил решение @ AndyE и реализовал это (почти хорошее) решение здесь: https://dl.dropboxusercontent.com/u/2683925/estante-components /visibility_test1.html (извините, у меня были некоторые проблемы с JSFiddle).
Это также доступно в Github: https://github.com/qmagico/estante-components
Это работает на хроме / хроме. Он работает на firefox, за исключением того, что он не загружает содержимое iframe (любая идея почему?)
В любом случае, чтобы решить последнюю проблему (4), единственный способ, которым вы можете это сделать, - прослушать для событий размытия / фокуса на iframe. Если у вас есть некоторый контроль над iframe, вы можете использовать API postMessage для этого.
https://dl.dropboxusercontent.com/u/2683925/estante-components/visibility_test2.html
Я все еще не тестировал это с достаточным количеством браузеров. Если вы можете найти более подробную информацию о том, где это не работает, сообщите мне, пожалуйста, в комментариях ниже.