2012-11-23 101 views
0

這是我的目標:當Zurb Modal窗口消失時,自動播放音頻停止。用JavaScript停止HTML5音頻(Jquery?)+ Zurb Modal

我是新來做這個東西,尤其是javascript!

我有一個Zurb模式窗口,可用作在頁面加載時彈出的啓動畫面。我在自動播放窗口中有HTML5音頻(這是一個請求 - 我不喜歡自動播放!)。單擊背景時窗口消失,但音頻繼續播放。我不知道如何讓音頻停止!如果有人有想法,我會非常感激聽到這個消息。

<script type="text/javascript" src="js/jquery.reveal.js"></script> 

<div id="myModal" class="reveal-modal"> 

    <audio controls="controls" autoplay="autoplay"> 
     <source src="audio/splash-loop-01.mp3" type="audio/mpeg"> 
     <source src="audio/splash-loop-01.ogg" type="audio/ogg"> 
     Your browser does not support the audio element. 
    </audio> 
</div> 
<div class="close-reveal-modal">CLOSE ME</div>​<!-- USE THIS TO CLOSE WINDOW --> 

<script> 
$(document).ready(function(){ 
    $('#myModal').reveal(); 
}); 
</script> 
+0

爲什麼你有自動播放聲音?很多時候,遊客會體驗到自動播放音頻的煩人...... – Cerbrus

+0

正如我在我的問題中提到的那樣,這是一個請求 - 合同的一部分。我也討厭它。 –

+0

哦,我讀過那個,我的不好。 – Cerbrus

回答

0

要暫停音頻,把這個在您的document.ready

$('.close-reveal-modal').click(function(){ 
    var myAudio = document.getElementsByTagName("audio")[0]; 
    if(myAudio != undefined){ 
     myAudio.pause(); 
    } 
} 
+0

@cerbus ......它沒有工作,但也許我寫的錯誤是: $(文件)。就緒(函數(){ \t \t \t \t \t \t \t \t \t \t $('#myModal 「).reveal(); \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t $('。close-reveal-modal')。click(function(){var myAudio = document.getElementsByTagName(「audio」)[0];如果(myAudio!=未定義){ myAudio.pause(); } } \t \t \t \t \t \t \t \t \t \t \t \t \t \t \t }); –

1
$(document).ready(function(){ 

    $('.close-reveal-modal').click(function(){ 

    audioPlayer.pause(); 
    audioPlayer.src = ''; 
    audioPlayer.load(); 

    }); 

}); 
+0

我還沒有這個工作。我是否將任何內容放入audioPlayer.src中? - 我希望我輸入正確的代碼: $(文件)。就緒(函數(){ \t \t \t \t \t $( '#myModal')顯示(); \t \t \t \t \t \t \t。 \t \t \t \t \t \t \t \t $( '近距離揭示模態'。)點擊(函數(){ audioPlayer.pause(); audioPlayer.src =''; audioPlayer.load(); }); }); –