網頁媒體播放利器 - JW Player的demo

JW Player是一款非常優秀的網頁媒體播放器,支持H.264 ( .mp4, .mov, .f4v )、FLV ( .flv ) 、3GPP ( .3gp, .3g2 )、OGG Theora ( .ogv )和WebM ( .webm )視頻格式,MP3 ( .mp3 )AAC ( .aac, .m4a )、OGG Vorbis ( .ogg )和WAV ( .wav )音頻,同時也支持swf和圖片( gif 、jpg、png)和YouTube格式視頻。

支持HTML5,有着非常豐富的插件可用(部分是收費的,如廣告插件)。

JW Player的最新版是5.7,官方網址:http://www.longtailvideo.com/players/jw-flv-player/?search=Playlist


jwplayer.js和player.swf是核心文件,必須引入這兩個文件。


代碼

<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" %>
<html>
	<head>
		<script type="text/javascript" src="../jwplayer/jwplayer.js"></script>
		<script type="text/javascript" src="./js/jquery.min.js"></script>
	</head>
	<body>

	<div id='my-video'></div>
	<input type="button" class="player-play" value="Play" />  
	<input type="button" class="player-stop" value="Stop" />  
	<input type="button" class="player-status" value="Status" />  
	<input type="button" class="player-position" value="TimeStamp" />  
	<input type="button" class="player-seek" value="Seek_15s" />  
	<input type="button" class="player-duration" value="Duration" />  

	 <script type='text/javascript'>  
	  var thePlayer;  
   
 		thePlayer = jwplayer('my-video').setup({       
 			autostart: true,//自動播放
 			//file: 'rtmp://101.200.2.53/live/test1',       
 			file: 'http://101.200.2.53:8080/HealthcarePlatform/data/MP4/test.mp4',
 			width: '480',        
 			height: '270'
 		}); 
 		
 		
 		$('.player-play').click(function(){  
    	if(thePlayer.getState() != 'PLAYING'){  
        	thePlayer.play(true);  
        	this.value = 'Pause';  
   	 	}else {  
        	thePlayer.play(false);  
       	 this.value = 'Play';  
    	}  
   	 });  
      
 //Stop  
 $('.player-stop').click(function(){thePlayer.stop();});  
      
 //Status  
 $('.player-status').click(function(){  
    var state = thePlayer.getState();  
    var msg;  
    switch(state){  
        case 'BUFFRING':  
            msg = 'Buffering';  
            break;  
        case 'PLAYING':  
            msg = 'Playing';  
            break;  
        case 'PAUSED':  
            msg = 'Pause';  
            break;  
        case 'IDLE':  
            msg = 'Stop';  
            break;  
        }  
        alert(msg);  
    });  
  
    //get current position  
    $('.player-position').click(function() { alert(thePlayer.getPosition()); });  
  
    //Seek  
    $('.player-seek').click(function(){  
        if(thePlayer.getState()!= 'PLAYING'){  
        thePlayer.play();  
        }  
        thePlayer.seek(15);  
    });  
      
    //get duration  
    $('.player-duration').click(function() {alert(thePlayer.getDuration());});  
 		
	</script>
	
	<br>
	<br>

	</body>
</html>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章