jplayer如何显示“缓冲”文本

时间:2015-05-08 12:03:51

标签: jquery html5 jplayer

我对jplayer有疑问。

这是我的代码:

$("#jquery_jplayer_1").jPlayer({
        ready: function () {
            $(this).jPlayer("setMedia", {
                title: "Alin",
                artist: "song",
                mp3: "utl"
            });
        },
        solution: 'html, flash',
        cssSelectorAncestor: "#jp_container_1",
        swfPath: "/res/vendor/jPlayer/dist/jplayer/",
        supplied: "mp3",
    });

    $("#jquery_jplayer_1").bind($.jPlayer.event.seeking, function(e){
        if($(".jp-title span").length <= 0){
            $(".jp-title").prepend('<span><i class="fa fa-refresh fa-spin"></i></span>');
        }
    });

    $("#jquery_jplayer_1").bind($.jPlayer.event.seeked, function(e){
        $(".jp-title span").remove();
    });



    $("#jquery_jplayer_1").bind($.jPlayer.event.timeupdate, function(e) {
        if (this.value === 0 ){
            alert(1);
        }
    });

如果播放的音乐由于互联网速度缓慢暂停,我想显示“缓冲”文字。实际上,我希望在暂停播放音频时暂停播放事件,然后在缓冲足够的数据时再次自动播放。

像这样:

enter image description here

感谢

1 个答案:

答案 0 :(得分:0)

$("#jquery_jplayer_1").bind($.jPlayer.event.progress, function (event){
   // If media loading is complete
   if (event.jPlayer.status.seekPercent === 100){        
     $(".jp-title .jp-title-loading").remove();

   // Otherwise, if media is still loading
   } else {
       if($(".jp-title .jp-title-loading").length == 0){
          $(".jp-title").prepend('<div class="jp-title-loading">Loading...</div>');
       }
    }
});