VLC is undoubtedly a good player software, sub-b/S Web project, if you can embed it in the page, do a page preview or other, is very good.
The first step: Download the VLC installation program; (Recommended 1.0.3 or 1.0.5 version, more stable)
http://download.videolan.org/pub/videolan/vlc/
Step two: Install; (I really do test on XP, Linux under the test ...) ）
Note that the Mozilla plug-in is selected, otherwise Firefox can not use the VLC control (ActiveX plugin is IE, I was in IE under the test)
Step Three: Page coding (I don't talk nonsense anymore, directly on the code)
page 1:test.html
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> on-Demand testing </title>
<script type= "Text/javascript" charset= "UTF-8" >
var vdurl = ""; Play path (defined as global variable, provide playback path to child page playback control)
function ShowDialog (type) {
Vdurl= "e:\\ Taiji guru 06.avi";
var temp=document.getelementsbyname (' FileName ') [0].value;
if (temp== ') {
Alert (' Please select a valid local video file, or enter a network video address ... ');
Return
}
Vdurl=temp;
Eventcode= "XXXX";
if (type==1) {
var winobj=window.open ('./empty_play.html ', ' play ',
' height=640, Width=740,toolbar=yes, Menubar=yes, Scrollbars=no, Resizable=no,location=no, Status=no ');
}else if (type==2) {
var winobj=window.open ('./play.html ', ' play ',
' height=640, Width=740,toolbar=yes, Menubar=no, Scrollbars=no, Resizable=no,location=no, Status=no ');
}
}
</script>
<body>
<input type= "File" Name= "FileName" style= "width:350px" >
<input type= "button" value= " broadcast put " onclick= "ShowDialog (1);" >
<br>
<span style= "color:red;font-weight:bold;font-size:14px" > Hint:</span>
<span style= "color:blue;font-weight:normal;font-size:14px" > Please select Local video or enter a network video path (it is recommended to play through VLC media player first). </span>
</body>
page 2:empty_play.html
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title> Video Clips </title>
<script type= "Text/javascript" charset= "UTF-8" >
<!--shielding Right button
Document.oncontextmenu=function (e) {return false;}
-->
var VLC; VLC objects
var itemId; The ID of the playlist in the play list
var Vlcsound; VLC volume size (initialization defaults to 50)
var videolength; Video Total time length
var then_time; Play Start time (playback start date, see below implementation code, it is milliseconds oh)
var isplaying=0; Play status (0 not played 1 playback)
initializing = = = It is important to control the entrance of the program
function Initplayurl () {
Vlc=document.getelementbyid ("VLC");
Add Playback Address
Vlc.playlist.add (WINDOW.OPENER.VDURL);
Play
Vlc.playlist.play ();
Add Play Address mode 2--recommended to control the playlist in the following way
var Vedio_url=window.opener.vdurl;
Itemid= Vlc.playlist.add (Vedio_url);
Vlc.playlist.playItem (ITEMID);
Get VLC Current volume
Vlcsound=vlc.audio.volume;
Set VLC volume values
document.getElementById ("Vlc_sound"). Value=vlcsound;
Play button not available
document.getElementById ("Play_button"). Disabled=true;
Check the status of the show-note that this is a deferred operation Oh (settimeout in milliseconds, 0.5 seconds here)
SetTimeout (checkvediostatus,500);
}
Check the status of a Play program
function Checkvediostatus () {
if (vlc.input.state>2 && vlc.input.state<5) {
isplaying=1;
Vlc.input.time current playback length, in milliseconds
Vlc.input.length Program total time, unit milliseconds
Videolength=parseint (vlc.input.length/1000);
var temp_total_time=parsetime (videolength);
Total time Length setting
document.getElementById ("Vedio_length"). Value=temp_total_time;
You can now enter a time period jump
document.getElementById ("Time_change"). Disabled=false;
Get current system time
Then_time=new Date (). GetTime ();
Calculate the current playback time point
Checktime ();
}else{
If it's not playing state, it's delayed.
SetTimeout (checkvediostatus,500);
}
}
Real-time detection system time, the calculation of video playback length (typical stopwatch function)
function Checktime () {
if (isplaying==1) {
SetTimeout ("Checktime ();", 50);
var temp_time=parseint ((New Date (). GetTime ()-Then_time)/1000);
document.getElementById ("Current_video_time"). Value=parsetime (Temp_time);
}
}
Change the playback address
function Changenewbegintime () {
Vlc.input.time get current playback time (milliseconds)/also reset current playback time point
var Jumptime=document.getelementbyid ("Change_length"). Value;
if (jumptime!= "") {
if (jumptime>videolength) {
Alert ("Sorry, the input value is greater than the total length of the video ...");
Return
}
vlc.input.time=jumptime*1000;
Then_time=new Date ()-jumptime*1000;
}
}
Convert seconds to time format (HH:MM:SS)
function Parsetime (numlength) {
var h_time=0;
var m_time=0;
var s_time=0;
if (numlength>=60) {
M_time=parseint (NUMLENGTH/60);
S_time=parseint (NUMLENGTH%60);
}else{
S_time=numlength;
}
if (m_time>=60) {
H_time=parseint (M_TIME/60);
M_time=parseint (M_TIME%60);
}
if (h_time<10) {
H_time= "0" +h_time;
}
if (m_time<10) {
M_time= "0" +m_time;
}
if (s_time<10) {
S_time= "0" +s_time;
}
Return h_time+ ":" +m_time+ ":" +s_time;
}
Stop playing
function Stopplay () {
Vlc.playlist.stop ();
isplaying=0;
Modify Play/Stop button status
document.getElementById ("Play_button"). Disabled=false;
document.getElementById ("Stop_button"). Disabled=true;
Modify the status of a jump button
document.getElementById ("Change_length"). value= "";
document.getElementById ("Time_change"). Disabled=true;
Current video playback time point empty
document.getElementById ("Current_video_time"). value= "";
}
Play again
function Repeatplay () {
Vlc.playlist.play ();
SetTimeout (checkvediostatus,500);
Modify Play/Stop button status
document.getElementById ("Play_button"). Disabled=true;
document.getElementById ("Stop_button"). Disabled=false;
}
Mute
function Nosound () {
if (vlcsound>0) {
Vlcsound=0;
}
Vlc.audio.toggleMute ();
Vlcsound=vlc.audio.volume;
document.getElementById ("Vlc_sound"). Value=vlcsound;
if (vlcsound==0) {
document.getElementById ("No_sound"). Value= " restore volume ";
document.getElementById ("No_sound"). Value= "" + "restore Volume" + "";
}else{
document.getElementById ("No_sound"). value= " static sound ";
document.getElementById ("No_sound"). Value= "" + "static" + "" + "sound" + "";
}
}
Volume Plus and minus
function Soundchange (nums) {
if (nums<0 && vlcsound==0) {
Alert ("The volume is minimal, the volume can no longer be reduced ...");
Return
}
Vlcsound+=nums;
if (vlcsound<=0) {
Vlcsound=0;
document.getElementById ("No_sound"). Value= "" + "restore Volume" + "";
}else{
When the volume is >0, the mute logo should be turned on
document.getElementById ("No_sound"). Value= "" + "static" + "" + "sound" + "";
}
if (vlcsound>200) {
Alert ("Maximum volume, no increase in volume ...");
vlcsound=200;
}
Vlc.audio.volume =vlcsound;
document.getElementById ("Vlc_sound"). Value=vlcsound;
}
Fullscreen
function Screenfull () {
Vlc.video.toggleFullscreen ()
}
</script>
<body onload= "Initplayurl ()" >
<!--[If ie]>
<object type= ' application/x-vlc-plugin ' id= ' VLC ' events= ' True '
Classid= ' clsid:9be31822-fdad-461b-ad51-be1d1c159921 ' width= "720" height= "540" >
<param name= ' MRL ' value= '/>
<param name= ' volume ' value= '/>
<param name= ' autoplay ' value= ' false '/>
<param name= ' Loop ' value= ' false '/>
<param name= ' fullscreen ' value= ' false '/>
</object>
<! [endif]-->
<!--[if! ie]><!-->
<object type= ' application/x-vlc-plugin ' id= ' VLC ' events= ' True ' width= ' 720 ' height= ' 540 ' >
<param name= ' MRL ' value= '/>
<param name= ' volume ' value= '/>
<param name= ' autoplay ' value= ' true '/>
<param name= ' Loop ' value= ' false '/>
<param name= ' fullscreen ' value= ' false '/>
</object>
<!--<! [endif]-->
<br><br>
<input type= "button" value= " broadcast put " Onclick= "Repeatplay ();" Id= "Play_button" >
<input type= "button" value= " stop Check " Onclick= "Stopplay ();" Id= "Stop_button" >
<input type= "button" value= " static sound " Onclick= "Nosound ();" Id= "No_sound" >
<input type= "button" value= " Decrease Volume " Onclick= "Soundchange (-10);" >
<input type= "button" value= " Increase volume " onclick= "Soundchange (10);" >
<input type= "button" value= " full screen " Onclick= "Screenfull ();" >
<font color= "Red" size= "2" > Volume: </font><input type= "text" id= "Vlc_sound" style= "Width:40px;color:blue" >
<br>
<font color= "Red" size= "2" > Total time: </font><input type= "text" id= "Vedio_length" "style=" Width:65px;color: Blue ">
<input type= "text" id= "Current_video_time" style= "Width:65px;color:blue" >
<font color= "Red" size= "2" > Jump: </font><input type= "text" id= "Change_length" style= "Width:100px;color": Blue ">
<span style= "color:blue;font-weight:normal;font-size:14px" > Sec </span>
<input type= "button" value= "to determine" id= "Time_change" disabled= "Disabled" onclick= "changenewbegintime ();" >
</body>
========================== End ======================
Preview effect
Big Ye's, the Cato time is very strange, the video card that plays is not down.
Because I have just studied, I hope that Members will make more comments. If you need the source code, QQ contact or leave your mailbox;
qq:305409913
Email:
Please continue to follow the next chapter: http://hi.baidu.com/huahua035/blog/item/20689b55897ecd40d10906f1.html
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
