Javascript video popup on click slider button

Question

Я пытаюсь запустить сценарий, где ..a ползунок - это #, а имя кнопки слайдера - «slide_8». когда кто-то нажимает на него, вы выходите из видео YouTube. В моем скрипте ниже видео воспроизводится, но не может быть в любом месте браузера. Я сохранил URL-адрес youtube внутри javascript.

<div class="overlay" style="display: none;"></div> 
<div class="propose-video-wrap" style="display: none;"> 
<div id="propose_video"></div> 
</div> 
<script type="text/javascript"> 
$('#slide_8').click(function() { 
    var video_htm = '<a class="pop-close-btn" onclick="closeVideoPopup();"></a> <iframe id="propose_video_iframe" width="300" height="150" src="//www.youtube.com/embed/SQtxJ15vzOU?rel=0&autoplay=1" frameborder="0" allowfullscreen="allowfullscreen"></iframe>'; 
    $('#propose_video').html(video_htm); 
    $('.overlay').css('display', 'block'); 
    $('.propose-video-wrap').css('display', 'block'); 
    $('body').css('overflow-y', 'hidden'); 
}); 

function closeVideoPopup() { 
    $('.overlay').css('display', 'none'); 
    $('.propose-video-wrap').css('display', 'none'); 
    $('#propose_video').html(''); 
    $('body').css('overflow-y', ''); 
} 
</script> 

Answer 1

Я вставил этот код в JSfiddle, добавил кнопку, и она работает. Единственные изменения, которые я сделал, это добавить прослушиватель событий для нажатия на кнопку закрытия, потому что по какой-то причине встроенная строка не работала над JSfiddle, а также вставляла какой-то текст внутри кнопки закрытия, поэтому можно щелкнуть по ней.

Возможно, проблема связана с вашими стилями, например, что любой из ваших элементов имеет отрицательный индекс z или находится в странном ключе. Отключите атрибут display: none и сначала вставьте текст внутри этих элементов HTML и посмотрите, где они находятся.

Если вы хотите увидеть, что у меня получилось, here is is.