如何玩HTML5video时

参考http://america.wtf/Shadex 如何玩HTML5video时

该网站暂停特定HTML5音频具有该音频播放自动。但是有一个视频页面。我想有这样，当你播放视频，它自动暂停音乐

<div id="videos" style="z-index:1" onClick="document.getElementById('sitemusic').pause();"><br /> 
 
<div align="center" id="videobox">Splash 
 
<video style="z-index:-1;" width="400" controls> 
 
    <source src="media/videos/splash.mp4" type="video/mp4"> 
 
    <source src="media/videos/splash.ogg" type="video/ogg"> 
 
    Your browser does not support HTML5 video. 
 
</video> 
 
</div> 
 
</div> 
 

 
<audio id="sitemusic" controls autoplay> 
 
    <source src="media/turbo_grid.ogg" type="audio/ogg"> 
 
    <source src="media/turbo_grid.mp3" type="audio/mpeg"> 
 
Your browser does not support the audio element. 
 
    <script> 
 
    var video = document.currentScript.parentElement; 
 
    video.volume = 0.1; 
 
    </script> 
 
</audio>

来源

2016-07-27 Korey Nadolny

有你看着设置在事件侦听器的东西的视频元素响应onPlay暂停音频？ – Offbeatmammal

不知道如何做到这一点。你有没有例子？ –

参见下面的更新的样本，这将：

暂停时播放音频视频
暂停视频时播放音频

注意到我从视频元素取出onClick，并且还增加了明确的id到<video>元素，使直接引用更容易

<div id="videos" style="z-index:1"><br /> 
<div align="center" id="videobox">Splash 
<video style="z-index:-1;" width="400" controls id="video"> 
    <source src="media/videos/splash.mp4" type="video/mp4"> 
    <source src="media/videos/splash.ogg" type="video/ogg"> 
    Your browser does not support HTML5 video. 
</video> 
</div> 
</div> 

<audio id="sitemusic" controls autoplay> 
    <source src="media/turbo_grid.ogg" type="audio/ogg"> 
    <source src="media/turbo_grid.mp3" type="audio/mpeg"> 
    Your browser does not support the audio element. 
    <script> 
    var audio = document.currentScript.parentElement; 
    audio.volume = 0.1; 

    var video = document.getElementById("video"); 
    // this event listener reacts to "play" happening on video element and enacts pause on the audio element 
    video.addEventListener('play', function(){document.getElementById("sitemusic").pause()},false); 
    // this event listener reacts to "pause" happening on video element and enacts play on the audio element 
    video.addEventListener('pause', function(){document.getElementById("sitemusic").play()},false); 
    </script> 
</audio>

来源

2016-07-30 02:01:21 Offbeatmammal

如何玩HTML5video时

回答

相关问题