controls.currentPosition
这个属性可以用来控制当前歌曲播放的进度,可写,比如设置
document.getElementById("wmpid").controls.currentPosition = 18
就是将当前歌曲进到18秒,我没有试过非整数部分可不可以生效(应该是可以的)
controls.currentPositionString
这是个只读属性。比如当前歌曲在18秒出则值为00:18.
至于你说的进度条,控制起来是用event.clientX属性,这是鼠标相对于窗口的横坐标。用这个数字减去那个进度条DIV的clientX属性就是鼠标在进度条上的位置。你自己可以作些加减微调确保结果适当。如果宽度100px,你点的位置是40px.那么用40/100*歌曲长度就是当前应该跳转到的位置了。
加入滑块也很简单,网上有很多drag类,加一个进去稍微调整一下就比较好了
顺便也贴一下wmp组件的基本属性吧,LZ如果没有的话可以稍微参考一下
URL:String指定媒体位置,本机或网络地址
uiMode:String播放器界面模式,可为Full, Mini, None, Invisible
playState:integer播放状态,1=停止,2=暂停,3=播放,6=正在缓冲,9=正在连接,10=准备就绪
enableContextMenu:Boolean启用/禁用右键菜单
fullScreen:boolean是否全屏显示
[controls] wmp.controls //播放器基本控制
controls.play播放
controls.pause暂停
controls.stop停止
controls.currentPosition:double当前进度
controls.currentPositionString:string当前进度,字符串格式。如“00:23”
controls.fastForward快进
controls.fastReverse快退
controls.next下一曲
controls.previous上一曲
[settings] wmp.settings //播放器基本设置
settings.volume:integer音量,0-100
settings.autoStart:Boolean是否自动播放
settings.mute:Boolean是否静音
settings.playCount:integer播放次数
[currentMedia] wmp.currentMedia //当前媒体属性
currentMedia.duration:double媒体总长度
currentMedia.durationString:string媒体总长度,字符串格式。如“03:24”
currentMedia.getItemInfo(const string)获取当前媒体信息"Title"=媒体标题,"Author"=艺术家,"Copyright"=版权信息,"Description"=媒体内容描述,"Duration"=持续时间(秒),"FileSize"=文件大小,"FileType"=文件类型,"sourceURL"=原始地址
currentMedia.setItemInfo(const string)通过属性名设置媒体信息
currentMedia.name:string同 currentMedia.getItemInfo("Title")
[currentPlaylist] wmp.currentPlaylist //当前播放列表属性
currentPlaylist.count:integer当前播放列表所包含媒体数
currentPlaylist.Item[integer]获取或设置指定项目媒体信息,其子属性同wmp.currentMedia
播放器界面做的很不错,请继续努力
------
问题补充:
那么 wmp在Firefox下如何控制?
-----
目前我所知道的firefox下同样支持以上属性。只是调用时候要这样<object type="application/x-ms-wmp">,其他都相同。我用的是firefox3.6,安装了wmp扩展控件。没有安装的用户可能不能正常浏览你的页面。
另外在测试的时候发现直接在原来的object里添加type属性不行,但是用一个新的object可以,原因未知。我想是不是不认clsid的问题。如果真是这样,可能需要用程序判断浏览器然后动态写入相应的object元素?
另外查找资料的时候发现了这篇文章
http://www.jb51.net/article/24207.htm
可以作为参考
以上
代码如下:
<scripttype="text/javascript">functionvidplay() {varvideo =
document.getElementById("Video1")varbutton =
document.getElementById("play")if(video.paused) {
video.play()
button.textContent ="||"
}else{
video.pause()
button.textContent =">"
}
}functionrestart() {varvideo = document.getElementById("Video1")
video.currentTime = 0
}functionskip(value) {varvideo = document.getElementById("Video1")
video.currentTime += value
}</script></head><body><videoid="Video1">// Replace these with your own video files.<sourcesrc="demo.mp4"type="video/mp4"/>
<sourcesrc="demo.ogv"type="video/ogg"/>HTML5 Video is required for this example.<ahref="demo.mp4">Download the video</a>file.</video><divid="buttonbar">
<buttonid="restart"onclick="restart()">[]</button><buttonid="rew"onclick="skip(-10)"><<</button><buttonid="play"onclick="vidplay()">></button>
<buttonid="fastFwd"onclick="skip(10)">>></button></div>
扩展资料:注意事项
一、history.pushState(data, title [, url])
往历史记录堆栈顶部添加一条记录;
data: onpopstate事件触发时作为参数传递过去;
title:页面标题,当前所有浏览器都会忽略此参数;
url: 页面地址,可选,缺省为当前页地址;
二、history.replaceState(data, title [, url])
更改当前的历史记录,参数同上;
三、history.state:
用于存储以上方法的data数据,不同浏览器的读写权限不一样;
四、window.onpopstate:响应pushState或replaceState的调用;
HTML实现 后退【window.history.back()】默认
HTML实现 后退【window.history.back(-1)】 括号里面的负数字代表后退几个页面,如果是-2的话就代表后退2页
HTML实现 前进【window.history.forward()】//不常用
HTML实现 前进【window.history.forward(1)】//不常用 括号里面的正数就代表要前进的页。如果是3就表示前进3页
[html] view plain copy
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<p>这是第一个页面</p>
<a href="HTMLPage2.htm">到dom页</a>
<input type="button" onclick="javascript:window.history.back()" value="后退"/>
<input type="button" onclick="javascript:window.history.forward()" value="前进" />
</body>
</html>
[html] view plain copy
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<p>这是第二个页面</p>
<a href="HTMLPage3.htm">转到第一页</a>
<a href="javascript:window.history.back()">后退</a>
<a href="javascript:window.history.forward()">前进</a>
</body>
</html>
可以的,你可以去百度搜索一个叫“秒秒学”的教学网站,里面Flash中的HTML5开发教程就会交互式的教你,在网页中插入视频,并如何利用JavaScript代码来控制视频,让网页中的视频受到鼠标的控制,任意暂停或播放,且实现快进功能。视频播放控制功能是由HTML5提供的。但是,在一些特殊的情况下(比如旧版浏览器、不兼容HTML5的应用平台等),我们可能无法使用其提供的播放控制功能。