<script type="text/javascript" src="jquery-ui-1.9.2.custom/js/jquery-1.8.3.js"></script> <script type="text/javascript" src="jwplayer/jwplayer.js"></script> <script type="text/javascript"> $(function() { jwplayer("myElement").setup({ file: "video/videoplayback_4.mp4", image: "学生.jpg", title:"JAVA原理与思想", width: 850, autostart: false,//自动播放 mute: false,//声音关闭 fallback: false,//禁用下载回调 //skin: "beelden",//不可用-免费版没有皮肤 primary: "mp4", //aspectratio: "12:5",//播放器比例,启用时只能使用width一个参数 /* 视频列表栏-可用 playlist: [{ image: "学生.jpg", file: "video/videoplayback_4.mp4", title: "JAVA原理与思想" },{ image: "images/icon-item-list.png", file: "video/videoplayback_4_start=44000.mp4", title: "IO流" }], listbar: { position: 'right', size: 320 },*/ /* logo-不可用-免费版不能用logo logo: { file: 'images/icon-item-list.png', link: 'http://www.baidu.com' }, */ /* 字幕-可用 tracks: [{ file: "/assets/captions-en.vtt", label: "English", kind: "captions", "default": true },{ file: "/assets/captions-fr.vtt", kind: "captions", label: "French" }],*/ height:450 }); }); /*切换课件*/ function changevideo(url,title,start,end){ jwplayer("myElement").setup({ file: url, title:title, image: "学生.jpg", width: 850, height:450 }); //如果start不为空,则从start秒开始播放 if(null != start && start > 0 ){ jwplayer("myElement").seek(start); } //如果end不为空,则播放到end秒停止 if(null != end && null != start && end > 0 && end > start){ jwplayer('myElement').onTime(function(event){ //console.info("duration:"+event.duration); //$.each( duration , function(i, n){ // alert( "Name: " + i + ", Value: " + n ); //}); //console.info("position:"+event.position); //如果用户拖动到限制之外的区域,则重回start播放 if(event.position > end || event.position < start){ jwplayer('myElement').seek(start); } }); } } </script>
<p>课件列表:</p>
<p><a href="javascript:changevideo('video/videoplayback_4.mp4','JAVA原理与思想',null,null);">JAVA原理与思想</a></p>
<p><a href="javascript:changevideo('video/videoplayback_4.mp4','IO流',null,null);">IO流</a></p>
<p><a href="javascript:changevideo('video/videoplayback_4.mp4','多线程',null,null);">多线程</a></p>
<p><a href="javascript:changevideo('video/videoplayback_4.mp4','JDBC',null,null);">JDBC</a></p>
<p><a href="javascript:changevideo('video/videoplayback_4.mp4','前端框架',null,null);">前端框架</a></p>
<p><a href="javascript:changevideo('video/videoplayback_4.mp4','10秒-30秒播放',10,30);">10秒-30秒播放</a></p>
<div id="myElement">视频课件加载中...</div>