我只是将这段代码放在一起,以便在悬停时播放音频..在测试页上,尝试将其合并到网站的其余部分中,但是jQuery与其他jQuery发生了冲突,并且在这一点上,noconflict模式非常漂亮巨大的工作。是否可以仅使用javascript执行以下操作?
<audio id="whiterose" preload="auto">
<source src="//sarahboulton.co.uk/audio/white-rose.mp3"></source>
<source src="//sarahboulton.co.uk/audio/white-rose.ogg"></source>
</audio>
<div class="whiterose">
<a href="http://sarahboulton.co.uk">white rose?</a>
</div>
<script>
//change audio 1 to audio 2.. 3 .. etc
var audioOne = $("#whiterose")[0];
$(".whiterose a")
.mouseenter(function() {
audioOne.play();
});
</script>
http://sarahboulton.co.uk/audio.html#
谢谢!
答案 0 :(得分:1)
<audio id="audio" preload="auto" src="http://sarahboulton.co.uk/audio/white-rose.mp3"></audio>
<div id="test" style="background-color:red;" class="whiterose">
<a href="http://sarahboulton.co.uk">white rose?</a>
</div>
<script>
var test = document.getElementById("test");
test.addEventListener("mouseover", function( event ) {
var audio = document.getElementById("audio");
audio.play();
}, false);
</script>