Как закрыть всплывающее окно, когда видео YouTube играет на кнопке кнопки ESC? -- javascript поле с участием jquery поле с участием html поле с участием dom пол Связанный проблема

How to close popup when youtube video is playing on esc button button?


0
vote

проблема

русский

Нажмите меня, чтобы увидеть демонстрацию

Когда видео не играет, то кнопка ESC нажала всплывающее окно, но он не работает при воспроизведении видео.

Английский оригинал

Click me to see the demo

When video is not playing then Esc button pressed the popup closes but it does not work when video is playing.

</div
           
 
 

Список ответов

0
 
vote

В вашем демонстрации убедитесь, что iFrame, содержащий видео, очищено, когда слой скрыт. Измените свою функцию «Скрыть»:

 <код> function popup(){     var img = document.getElementsByClassName('image-bann')[0];     img.querySelector('iframe').src = "https://www.youtube.com/embed/0mQLTWvXbXM";     document.getElementsByClassName('pop')[0].style.display="block"; }  function hide(e) {     var img = document.getElementsByClassName('image-bann')[0];     if (img.contains(e.target)) {         e.preventDefault();         return false;     }     img.querySelector('iframe').src = "about:blank";     document.getElementsByClassName('pop')[0].style.display="none"; }   
 

In your demo, ensure the iframe containing the video is cleared when the layer is hidden. Change your hide function to this:

function popup(){     var img = document.getElementsByClassName('image-bann')[0];     img.querySelector('iframe').src = "https://www.youtube.com/embed/0mQLTWvXbXM";     document.getElementsByClassName('pop')[0].style.display="block"; }  function hide(e) {     var img = document.getElementsByClassName('image-bann')[0];     if (img.contains(e.target)) {         e.preventDefault();         return false;     }     img.querySelector('iframe').src = "about:blank";     document.getElementsByClassName('pop')[0].style.display="none"; } 
</div
 
 
         
         

Связанный проблема

0  .append () элемент с более чем одним классом  ( Append element with more than one class ) 
Я не могу найти информацию о том, можно ли использовать .append (), чтобы добавить элемент в HTML и дать этому элементу более одного класса <код> $( ".nav"...

0  JavaScript Ball Collision  ( Javascript ball collision ) 
Я пытаюсь создать простую игру JavaScript с простыми физиками. Я могу определить, когда 2 шарика столкнулись, но у меня возникли проблемы с обработкой столкно...

0  Google Map не отображает  ( Google map not displaying ) 
У меня есть карта Google, которая используется здесь: http://www.comehike.com/outdoors/birds/birds.php Теперь я вижу сообщения об ошибках .j для 1) Инициа...

4  Является ли хорошей идеей использовать условные зависимости в модулях AMD?  ( Is it a good idea to use conditional dependencies in amd modules ) 
Я думаю об использовании условий для указания модуля зависит в модульной системе AMD. Например, чтобы загрузить библиотеку на браузере и библиотеку на сервере...

0  Кнопка CKeditor 4 Не отображается  ( Ckeditor 4 underline button not showing ) 
Это мой код JavaScript для конфигурации моего CKEDITOR. Я нахожу на браузере для этого решения, но я не могу найти никакого решения даже на официальном сайте ...

30  Как я могу использовать Nodejs с Windows 7? [закрыто]  ( How can i use nodejs with windows 7 ) 
<в сторону CLASS = "S-NEWACTS S-WELTIVE__info JS-Post-New Imide MB16« Роль = «Статус»> <Путь d = "M15 6.38A6.48 6.48 0 007.78. 04H-.02A6.49 6.49 0 002.05 ...

1  JavaScript: Получение идентификатора родителя из документа  ( Javascript getting the id of the parent from a document ) 
У меня возникли проблемы с тем, чтобы получить идентификатор родителя документа, который здесь «iFrame1». Как вы можете видеть, что JavaScript должен проживат...

1  Форма подписки Rapidmail перенаправляет после подписки электронной почты - MailChimp  ( Rapidmail subscription form redirect after email subscription mailchimp ) 
Я создаю веб-страницу, которая включает в себя очень простую форму подписки, в основном собирая адреса электронной почты, заинтересованные в продукте. Для это...

59  Дисплей Div в положении курсора в Textarea [дубликат]  ( Display div at cursor position in textarea ) 
<в сторону CLASS = "S-NEWACTS S-WELTIVE__info JS-Post-New Imide MB16« Роль = «Статус»> Этот вопрос уже есть ответы здесь : ...

0  Обновление происхождения перетаскивания / прокрутки после обновления данных с переходом в D3  ( Update drag scroll origin after an update of the data with transition in d3 ) 
Я работаю на диаграмме с перетаскиванием, масштабированием и обновлениями. Это в основном работает, однако, после добавления новых данных позиция перетаскиван...

1  JavaScript не работает над динамическим контентом  ( Javascript not working on dynamic content ) 
У меня есть страница, где в HTML Div загружен с другой страницы. На родительской странице у меня есть JavaScript, который имеет элементы, которые применяются ...

0  Отображать имя страницы в JavaScript?  ( Display page name in javascript ) 
Как бы я добавил <код> location.href.split('/').pop() к документу HTML для отображения имени страницы? (Не весь URL) я хотел бы отобразить только имя страниц...

0  Сортировка не работает в смарт-таблице угловой JS  ( Sorting is not working in smart table angular js ) 
Сортировка смарт-таблицы не работает по какой-то причине после использования в качестве пользовательской директивы. Можете ли вы помочь мне, что я сделал не т...

0  Новое развитие приложений с использованием Cordova и Ionic  ( Native app development using cordova and ionic ) 
Как сохранить процесс или сервис всегда запущены даже после того, как приложение будет убито пользователем, похожее на секундомер, который будет запущен даже ...

0  Почему Autoseizecolumn () Loop, похоже, замораживает сценарий Google Apps?  ( Why does an autoresizecolumn loop seem to freeze a google apps script ) 
Все, что я пытаюсь сделать, это изменить размер всеми колонны в электронной таблице. Это автономная электронная таблица. Я использую: <код> function format(...

Связанный проблема

0  .append () элемент с более чем одним классом 
0  JavaScript Ball Collision 
0  Google Map не отображает 
4  Является ли хорошей идеей использовать условные зависимости в модулях AMD? 
0  Кнопка CKeditor 4 Не отображается 
30  Как я могу использовать Nodejs с Windows 7? [закрыто] 
1  JavaScript: Получение идентификатора родителя из документа 
1  Форма подписки Rapidmail перенаправляет после подписки электронной почты - MailChimp 
59  Дисплей Div в положении курсора в Textarea [дубликат] 
0  Обновление происхождения перетаскивания / прокрутки после обновления данных с переходом в D3 
1  JavaScript не работает над динамическим контентом 
0  Отображать имя страницы в JavaScript? 
0  Сортировка не работает в смарт-таблице угловой JS 
0  Новое развитие приложений с использованием Cordova и Ionic 
0  Почему Autoseizecolumn () Loop, похоже, замораживает сценарий Google Apps?