我正在尝试jPlayer
在我的网站上安装,但它不适用于 Firefox (22.0)。只有单击随机按钮才会显示播放列表,然后我可以播放歌曲但进度条始终为空。当 DOM 准备好时,列表为空(带有 jp-playlist 类的 div)。
这是代码:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var jplayer = new jPlayerPlaylist({
jPlayer: "#jquery_jplayer_1",
cssSelectorAncestor: "#jp_container_1"
}, [{
title="My title",
mp3 : "/music/my_song.mp3"
},
{
title="My title2",
mp3 : "/music/my_song2.mp3"
}],
{
swfPath: "http://www.jplayer.org/latest/js/Jplayer.swf",
supplied: "mp3",
volume: .7,
wmode:"window",
solution: "html,flash"
});
});
</script>
<div id="jp_container_1" class="jp-video jp-video-270p">
<div class="jp-type-playlist">
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div class="jp-gui">
<div class="jp-interface">
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>
<div class="jp-current-time"></div>
<div class="jp-duration"></div>
<div class="jp-controls-holder">
<ul class="jp-controls">
<li><a href="javascript:;" class="jp-previous" tabindex="1">Précédent</a></li>
<li><a href="javascript:;" class="jp-play" tabindex="1">Jouer</a></li>
<li><a href="javascript:;" class="jp-pause" tabindex="1">Pause</a></li>
<li><a href="javascript:;" class="jp-stop" tabindex="1">Stop</a></li>
<li><a href="javascript:;" class="jp-next" tabindex="1">Suivant</a></li>
</ul>
<div class="sound-bar">
<ul class="jp-controls sound">
<li><a href="javascript:;" class="jp-mute" tabindex="1" title="Muet">Mute</a></li>
<li><a href="javascript:;" class="jp-unmute" tabindex="1" title="Actif">Unmute</a></li>
<li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="Volume max">Volume max</a></li>
</ul>
<div class="jp-volume-bar">
<div class="jp-volume-bar-value"></div>
</div>
</div>
<ul class="jp-toggles">
<li><a href="javascript:;" class="jp-shuffle" tabindex="1" title="Aléatoire">Aléatoire</a></li>
<li><a href="javascript:;" class="jp-shuffle-off" tabindex="1" title="Désactiver aléatoire">Non aléatoire</a></li>
<li><a href="javascript:;" class="jp-repeat" tabindex="1" title="Répéter">Répéter</a></li>
<li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="Désactiver répétition">Ne pas répéter</a></li>
</ul>
</div>
<div class="jp-title">
<ul>
<li></li>
</ul>
</div>
</div>
</div>
<div class="jp-playlist">
<ul>
<!-- The method Playlist.displayPlaylist() uses this unordered list -->
<li></li>
</ul>
</div>
</div>
</div>
<script type="text/javascript" src="/js/jPlayer/jplayer.min.js"></script>
<script type="text/javascript" src="/js/jPlayer/add-on/playlist.min.js"></script>
谢谢你的帮助