音頻不會停止時關閉HTML5模式與嵌入式視頻

我有一個VIMEO視頻嵌入模式。這是簡單的代碼，我認爲它只是顯示/隱藏，所以即使視頻不見了，音頻仍在播放 - 但我不確定。模式的作品和關閉按鈕的作品，但語音保持。新模式 - 真的可以使用一些幫助。謝謝。下面的代碼音頻不會停止時關閉HTML5模式與嵌入式視頻

CSS

.modalDialog { 
    position: fixed; 
    font-family: Arial, Helvetica, sans-serif; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    z-index: 99999; 
    opacity:0; 
    -webkit-transition: opacity 400ms ease-in; 
    -moz-transition: opacity 400ms ease-in; 
    transition: opacity 400ms ease-in; 
    pointer-events: none; 
} 

.modalDialog:target { 
    opacity:1; 
    pointer-events: auto; 
} 

.modalDialog > div { 
    width: 600px; 
    height:400px; 
    position: relative; 
    margin: 10% auto; 
    padding: 5px 20px 13px 20px; 
    border-radius: 10px; 
    background: #fff; 
    background: -moz-linear-gradient(#fff, #999); 
    background: -webkit-linear-gradient(#fff, #999); 
    background: -o-linear-gradient(#fff, #999); 
} 

.close { 
    background: #606061; 
    color: #FFFFFF; 
    line-height: 25px; 
    position: absolute; 
    right: -12px; 
    text-align: center; 
    top: -10px; 
    width: 24px; 
    text-decoration: none; 
    font-weight: bold; 
    audio: none; 
    -webkit-border-radius: 12px; 
    -moz-border-radius: 12px; 
    border-radius: 12px; 
    -moz-box-shadow: 1px 1px 3px #000; 
    -webkit-box-shadow: 1px 1px 3px #000; 
    box-shadow: 1px 1px 3px #000; 
} 

.close:hover { 
    background: #00d9ff; 
}

HTML：

<a href="#openModal"> 
    <img src="img/video-play.png" width="125" height="125"> 
</a></h2>   

<div id="openModal" class="modalDialog"> 
<div><a href="#close" title="Close" class="close">X</a> 

<iframe src="http://player.vimeo.com/video/14266818" width="600" 
    height="400px" frameborder="0" webkitallowfullscreen mozallowfullscreen  
    allowfullscreen></iframe> 
</div></div>

來源

2014-01-20 user3216078

你能設置一個工作示例的小提琴嗎？當用戶點擊「關閉」時，你會做什麼？ – Phlume

它關閉模態窗口。模式和視頻關閉，但音頻繼續....嘆息 – user3216078

我有一個模式一個VIMEO以及和我用下面的腳本完全關閉電影時，「X」荷蘭國際集團脫離模式。

$('#videoToggleOff').click(function(){ 
    $('iframe#myVideo').attr('src',''); 
    $('iframe#myVideo').attr('src','your vimeo link here'); 
});

HTML

莫代爾退出按鈕

<button type="button" class="close" data-dismiss="modal" aria-hidden="true" id="videoToggleOff"><h4 class="videoText">X</h4></button>

iframe的模態

<iframe id="myVideo" src='your vimeo link' frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

劇本基本上消除被點擊退出時的視頻，但然後重置URL所以如果用戶再次點擊播放其不破壞。

來源

2014-01-20 18:44:05

要麼我做錯了什麼或不幸的是，這不起作用 - 新按鈕沒有關閉模式，即使視頻暫停，音頻仍然在播放。感謝您的幫助 - 如果您想到按鈕無法關閉模式的任何原因，請高興地聽到它。 – user3216078

我正在使用Bootstrap以及Bootstrap.js，其中包含JQuery來控制模式。如果您沒有使用引導程序並使用其他JS來控制模式，則需要更新關閉模式按鈕代碼才能使用腳本。 –

音頻不會停止時關閉HTML5模式與嵌入式視頻

回答

相關問題