覆盖jPlayer中的负剩余时间
Posted
技术标签:
【中文标题】覆盖jPlayer中的负剩余时间【英文标题】:Override negative remaining time in jPlayer 【发布时间】:2015-05-02 12:16:15 【问题描述】:我想知道 jPlayer 插件中是否有任何方法可以覆盖 jp-duration
div 中的 剩余时间 文本。简单地说,我只想删除分钟/秒之前的-
。所以我只想要03:26
而不是-03:26
。是否有任何预构建的功能可以让我这样做,或者是否需要编写一些自定义脚本来完成我想要做的事情?
JSFiddle
HTML
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div id="jp_container_1" class="jp-audio" role="application" aria-label="media player">
<div class="jp-type-single">
<div class="jp-gui jp-interface">
<div class="jp-volume-controls">
<button class="jp-mute" role="button" tabindex="0">mute</button>
<button class="jp-volume-max" role="button" tabindex="0">max volume</button>
<div class="jp-volume-bar">
<div class="jp-volume-bar-value"></div>
</div>
</div>
<div class="jp-controls-holder">
<div class="jp-controls">
<button class="jp-play" role="button" tabindex="0">play</button>
<button class="jp-stop" role="button" tabindex="0">stop</button>
</div>
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>
<div class="jp-current-time" role="timer" aria-label="time"> </div>
<div class="jp-duration" role="timer" aria-label="duration"> </div>
<div class="jp-toggles">
<button class="jp-repeat" role="button" tabindex="0">repeat</button>
</div>
</div>
</div>
<div class="jp-details">
<div class="jp-title" aria-label="title"> </div>
</div>
<div class="jp-no-solution">
<span>Update Required</span>
To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
</div>
</div>
</div>
JS
$(document).ready(function()
$("#jquery_jplayer_1").jPlayer(
ready: function(event)
$(this).jPlayer("setMedia",
title: "Bubble",
m4a: "http://jplayer.org/audio/mp3/Miaow-07-Bubble.mp3",
oga: "http://jplayer.org/audio/ogg/Miaow-07-Bubble.ogg"
);
,
swfPath: "http://jplayer.org/latest/dist/jplayer",
supplied: "mp3, oga",
wmode: "window",
useStateClassSkin: true,
autoBlur: false,
smoothPlayBar: true,
keyEnabled: true,
remainingDuration: true,
toggleDuration: true
);
);
【问题讨论】:
不明白为什么这被否决了? 【参考方案1】:不幸的是,负剩余时间是硬编码的,无法通过选项控制。
最简单的解决方案是下载jPlayer latest release并修改dist/jquery.jplayer.js
如下:
替换以下行:
durationText = (remaining > 0 ? '-' : '') + this._convertTime(remaining);
与:
durationText = this._convertTime(duration);
您可以选择缩小修改后的文件(例如,here)。
最后,您需要在页面上包含修改后的文件而不是原始版本。
【讨论】:
以上是关于覆盖jPlayer中的负剩余时间的主要内容,如果未能解决你的问题,请参考以下文章