Javascript Flowplayer程序条全速运行
我正在为我的基于mp3文件的站点使用带有Javascript插件的flowplayer。现在,除了进度条和缓冲区外,一切都正常了。缓冲区div的宽度仅为451px,而我的轨迹div的自定义宽度(我在CSS中给出)为903px。当我点击play按钮时,progress div将变为451px的全宽。播放没有问题。当我提供了一个持续时间,比如402或其他什么,那么进度条和播放头就会根据需要从起点开始移动。所以我认为这可能是计算mp3文件持续时间的问题。请让我知道如何解决这个问题。 我的代码是这样的Javascript Flowplayer程序条全速运行,javascript,jquery,flowplayer,Javascript,Jquery,Flowplayer,我正在为我的基于mp3文件的站点使用带有Javascript插件的flowplayer。现在,除了进度条和缓冲区外,一切都正常了。缓冲区div的宽度仅为451px,而我的轨迹div的自定义宽度(我在CSS中给出)为903px。当我点击play按钮时,progress div将变为451px的全宽。播放没有问题。当我提供了一个持续时间,比如402或其他什么,那么进度条和播放头就会根据需要从起点开始移动。所以我认为这可能是计算mp3文件持续时间的问题。请让我知道如何解决这个问题。 我的代码是这样的
<div id="audio" style="display:block;height: 0px;visibility: hidden"></div>
<div id="footer" class="footer"></div>
window.onload = function(){
$f("audio", "swf/flowplayer-3.2.7.swf", {
// don't start automatically
clip: {
autoPlay: false,
autoBuffering: true,
duration:430,
baseUrl: 'http://localhost/gaanaOnline/gaanaonline',
onFinish: function() {
setTimeout('player_next()',100);
}
},
onLoad: function() {
load_clips();
},
// disable default controls
plugins: {
audio: {
url: 'swf/flowplayer.audio-3.2.2.swf'
},
controls: null
}
// install HTML controls inside element whose id is "hulu"
}).controls("footer", {
// CSS class name for the playhead
playHeadClass: 'playhead',
// CSS class name for the track
trackClass: 'track',
// CSS class name for the playhead when in a playing state
playClass: 'play',
// CSS class name for the playhead when in a paused state
pauseClass: 'pause',
// CSS class name for the buffer bar
bufferClass: 'buffer',
// CSS class name for the progress bar
progressClass: 'progress',
// CSS class name for the time display
timeClass: 'time',
// CSS class name for mute button
muteClass: 'mute',
// CSS class name for the unmute button
unmuteClass: 'unmute',
// a default duration for the time display in seconds
duration: 0
});
};
window.onload=函数(){
$f(“音频”,“swf/flowplayer-3.2.7.swf”{
//不要自动启动
剪辑:{
自动播放:错误,
自动缓冲:是的,
持续时间:430,
baseUrl:'http://localhost/gaanaOnline/gaanaonline',
onFinish:function(){
setTimeout('player_next()',100);
}
},
onLoad:function(){
加载U形夹();
},
//禁用默认控件
插件:{
音频:{
url:'swf/flowplayer.audio-3.2.2.swf'
},
控件:null
}
//在id为“hulu”的元素内安装HTML控件
}).controls(“页脚”{
//播放头的CSS类名
playhead类:“playhead”,
//曲目的CSS类名
trackClass:“track”,
//处于播放状态时播放头的CSS类名
游戏课:“玩”,
//处于暂停状态时播放头的CSS类名
pauseClass:“暂停”,
//缓冲条的CSS类名
bufferClass:'buffer',
//进度条的CSS类名
progressClass:“progress”,
//时间显示的CSS类名
timeClass:'时间',
//静音按钮的CSS类名
mute类:“mute”,
//取消静音按钮的CSS类名
unmute类:“unmute”,
//时间显示的默认持续时间(以秒为单位)
持续时间:0
});
};
如果是mp3文件的持续时间问题,请建议我如何在JS中计算并提供给播放器
编辑:我添加了以下截图:
是否可以获得进度条的屏幕截图,让人们更容易理解?根据我的经验,不管mp3的持续时间是多少,我们的进度条总是正确显示。@Yudong Li:我添加了屏幕截图。在这里,我将持续时间指定为10秒。不管持续时间如何,缓冲区div总是453px宽,进度条会增长到这个宽度。我已经解决了缓冲区长度的问题。这实际上是一个与tracker div的宽度有关的问题。现在只有持续时间的问题仍然存在。如果没有给出持续时间,则progresbar将变为全长。我在Flowplayer论坛上多次看到同样的问题,大多数问题都是通过给出持续时间来解决的。持续时间是在mp3的元数据中设置的吗?我已经打印了元数据,它没有显示我正在使用的文件的持续时间。所以这是文件的问题?当文件开始播放时,它还会显示0NaN:0NaN。如果我停下来玩几次,它就会显示持续时间。