我正在尝试添加进度条以显示播放期间歌曲的位置.它只需要一个简单的解决方案.我在网上找到了一些代码,它使用SoundManager2 http://www.schillmania.com/projects/soundmanager2/功能调整div宽度以匹配歌曲的位置,但它似乎没有工作,不知道我要去哪里错了,任何帮助将不胜感激.
我已经使用了所有必需的Soundmanager2文件和播放的歌曲工作.它只是进度条的问题.
这是javascript:
soundManager.setup({
url: '/swf',
preferFlash: false,
waitForWindowLoad: true,
onready: function() {
var myTrack1 = soundManager.createSound({
id: 'trackOne', url: 'msamples/beep-1.mp3', volume: 80, autoPlay: false,});
$(".progBar").css('width', ((this.position/this.duration) * 100) + '%');
$("li.a5 a").click(function(event){soundManager.play('trackOne');});
},
ontimeout: function() {
// Uh-oh. SWF missing, Flash blocked or other issue
}
});
Run Code Online (Sandbox Code Playgroud)
HTML链接使用此格式,进度条位于下方:
<li class="a5">Song1:
<a href="msamples/beep-1.mp3" title="Play" class="sm2_button">Play</a>
<div id="track1"><div class="progBar"></div></div>
</li>
Run Code Online (Sandbox Code Playgroud)
CSS是:
#track1 {
background-color: #333333;
height: 10px;
margin-top: 10px;
position: relative;
width: 100%;
}
.progBar {
background-color:#FFF;
height:10px;
} …Run Code Online (Sandbox Code Playgroud)