javascript 鼠标悬停时的音频
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3342803/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Audio on mouseover
提问by oshirowanen
It it working partially, but how do I get the below to work with multiple audio files:
它部分工作,但我如何让以下内容与多个音频文件一起使用:
<!DOCTYPE HTML>
<html>
<body>
<script language="javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
var birdhover = $('.birds');
var birdaudio = birdhover.find('audio')[0];
birdhover.hover(function(){
birdaudio.play();
}, function(){
birdaudio.stop();
});
});
</script>
<div class="birds" style="width:30px;height:30px;background-image:url(image1.gif');cursor:pointer;">
<audio src="sound1.ogg" preload="auto"></audio>
</div>
<div class="birds" style="width:30px;height:30px;background-image:url('/home/imran/Desktop/images/vowel_short_2.gif');cursor:pointer;">
(image2.gif');cursor:pointer;">
<audio src="sound2.ogg" preload="auto"></audio>
</div>
</body>
</html>
Both images play the same sound.
两个图像播放相同的声音。
回答by jAndy
if you don't mind using HTML5:
如果您不介意使用HTML5:
HTML
HTML
<div class="birds">
<audio src="/sounds/bird.mp3" preload="auto"></audio>
</div>
Javascript
Javascript
$(function(){
var birdhover = $('.birds');
var birdaudio = birdhover.find('audio')[0];
birdhover.hover(function(){
birdaudio.play();
}, function(){
birdaudio.stop();
});
});
回答by Barrie Reader
updated for multiple sound files
This is what I used before:
http://plugins.jquery.com/project/sound
更新了多个声音文件
这是我以前使用的:http:
//plugins.jquery.com/project/sound
Usage:
用法:
$("#sound").sound({swf: url});
$("#sound").load(url);
$("#sound").play();
$("#sound").pause();
$("#sound").stop();
$("#sound").volume(0-100);
(taken from jQuery plugins page)
(取自 jQuery 插件页面)
for mouseover:
鼠标悬停:
$('#selector').mouseover(function() {
$("#sound").play('path/to/wav/or/mp3');
});
$('#second-selector').mouseover(function() {
$("#sound2").play('path/to/second/wav/or/mp3');
});

