[分享]制作DIY的HTML5视频播放器(Video)

  最近看了下HTML5，当看到Video标签的时候，就尝试了下弄个美化程度还可以的播放器。
  基本效果图：

  基本功能：
  1、简单的html页面，页面上放置了一个播放器界面的HTML代码，页面的MP4地址是写死的，
        通过js来加载播放器JS:var ps=new jsPlayer("600","500","myVideo");
  2、实现了点击播放按钮来开始和暂停视频，点击视频屏幕来开始和暂停视频。
  3、可以点击进度条或者拖动白点来 前进|后退 视频。
  4、可以缩放音量，通过点击或者拖动。
  未完成的功能
  1、播放列表
  2、全屏
  有兴趣的可以自己去研究研究。

  还有感觉JS写的有点不优雅 希望JS高手可以帮提点小意见。

   实例代码下载

197 个解决方案

#1

感谢分享,

#2

感谢分享。顺便给大家再分享一个入口
http://www.open-lib.com/Type/179-1.jsp

#3

     啊啊啊啊啊啊啊啊啊啊啊，还没学JS啊。楼主不错。

#4

#5

想看效果的请下载实例，使用chrome观看。

#6

 谢谢分享~~

#7

不错，HTML5

#8

前排留名

#9

悲剧的是各大浏览器支持的视频格式竟然不统一 哎.

#10

跟不上时代了，都H5了

#11

该回复于2013-03-29 15:43:19被管理员删除

#12

不错，支持一下，谢谢分享！

#13

该回复于2013-03-31 00:20:57被版主删除

#14

该回复于2013-03-29 20:32:10被版主删除

#15

该回复于2013-03-31 00:21:38被版主删除

#16

不错，支持一下。

#17

支持。。。。。

#18

既然用到了jquery,可以写一个jquery插件jquery.player.js
$("#myVideo").player(700,500);

#19

该回复于2013-03-29 20:31:44被版主删除

#20

引用 18 楼 thc1987 的回复:

既然用到了jquery,可以写一个jquery插件jquery.player.js
$("#myVideo").player(700,500);

呵呵 是的。
可以的话 当然是可以把播放器代码全放在js里面 然后用$()去调用的
当初为了简单的实现功能就没有去弄啦。

#21

该回复于2013-03-29 16:48:20被管理员删除

#22

该回复于2013-03-31 00:18:39被版主删除

#23

可以呀，很不错嘛。感觉自己好像在这块落下好多好多了。。这方面发展的真心快呀

#24

感谢分享。。呵呵。

#25

该回复于2013-03-29 20:32:35被版主删除

#26

该回复于2013-03-29 20:32:51被版主删除

#27

该回复于2013-03-29 20:32:43被版主删除

#28

很好，很强大，很美观

#29

支持，学以致用，非常好

#30

也在学习html5，jquery智商为0，补充能量中，求经验。

#31

太好了谢谢分享

#32

该回复于2013-03-31 00:16:23被版主删除

#33

该回复于2013-03-30 09:59:24被管理员删除

#34

该回复于2013-03-30 09:53:50被管理员删除

#35

该回复于2013-03-31 00:27:04被版主删除

#36

该回复于2013-03-31 00:19:13被版主删除

#37

该回复于2013-03-31 00:19:45被版主删除

#38

支持一下！

#39

该回复于2013-03-31 00:20:02被版主删除

#40

看看，html5就是强大啊

#41

不错，支持一下

#42

该回复于2013-03-31 00:17:16被版主删除

#43

该回复于2013-03-30 10:36:50被管理员删除

#44

该回复于2013-03-30 10:59:59被管理员删除

#45

该回复于2013-03-31 00:26:53被版主删除

#46

该回复于2013-03-31 00:21:58被版主删除

#47

该回复于2013-03-31 00:17:26被版主删除

#48

该回复于2013-03-31 00:22:10被版主删除

#49

该回复于2013-03-31 00:12:55被版主删除

#50

支持，学以致用，非常好