Web video control usage guide

xiaoxiao2021-03-05  25

□ Playing method and attribute

In addition to play, pause, stop, the media player can also use the following properties:

Scanning - Similar to the fast forward function of the recorder;

Search - Specific performance time that moves directly to the marked marked in the clip;

□ play

The media player provides two technologies to specify the media name (clip) to play, you can set the FileName genus

Sex, or call the OPEN method. If the value of the AutoStart property is True, when the filename property is set

After the URL of the movie clip, the movie clip will start playing; otherwise the movie clip will not start playing, unless you

Call the Play method. Open method starts playing is asynchronous, it is not like a Play method to wait until the end of other processes

Then start playing.

The media player provides the following similar video properties and methods to control the streaming media:

Play, STOP, PAUSE method, start, stop, suspend streaming media.

Playcount properties, set the number of files played.

Autorewind property determines whether or not to return to the beginning of movie clips when playing.

□ audio control

The media player provides the following properties to manage audio:

Balance property, determine the sound balance of the left and right speakers;

VOLUME properties, used to increase or reduce volume;

Mute properties, used to close or open sound;

※ You can set the showaudioControls property to True to add controls that handle the sound in the control bar.

□ Scan

The media player provides the following properties to scan:

Fastforward method, fast forward;

Fastreverse method, faster;

Rate properties, change the play rate;

※ If you want to make the movie clip can be scanned, you must set the Canscan and the AllowScan property to True.

□ Search

The properties used for search are:

The MarkerCount property indicates the total number of tags in the clip;

CurrentMaker, getMarkername, getMarkertime method, used to return tag information;

Markerhit events triggered when you encounter tags;

CurrentPosition Attribute, current location (in seconds), can be used to move the play head to the point specified in the clip;

PositionChange event, trigger when setting the currentPosition property;

※ If you want to search any time, you must set the canseek property to true. If you want to search the tag point, you must

Set the CanseekTomarkers property to True.

□ Media player's appearance interface

In the web page, you can control which parts of the media player through related properties, which are not.

Media players include the following elements:

Video Display Panel: Video Display Panel;

Video Border: Video Border;

Closed Captioning Display Panel; Subtitle Display Panel

TRACK BAR; search bar;

Control Bar with Audio and Position Controls: A control bar with sound and location control;

Go to bar: Go to the column;

Display Panel: Display panel;

Status bar: status bar; the following properties are used to determine which element:

ShowControls properties: Whether to display a control bar (including play controls and optional sound and location controls);

ShowAudioControls Attribute: Whether to display a sound control (mute button and volume slider) in the control bar;

ShowPositionControls Attribute: Whether to display location controls in the control bar (including backward jump, rewind,

Fast forward, jump forward forward, preview each clip in the playlist);

ShowTracker Attribute: Whether to display a search bar;

ShowDisplay property: Whether to display the display panel (used to provide information and clip information);

Showcaptioning Properties: Whether to display the subtitle display panel;

Showgotobar Attribute: Whether to display the turn to the column;

Showstatusbar Attribute: Whether the status bar is displayed;

□ Playlist

The media player provides the following method to access the editing in the playlist:

Next method, jump to the next clip in the program (playlist);

Previous method, jump back to the previous clip in the program;

One feature of the media player is able to preview each clip in the program, use the following properties:

The PreviewMode property determines whether the media player is currently in preview mode;

CANPREVIEW attribute determines whether the media player can be in preview mode;

In the Windows Media Pair file, you can specify a preview time for each clip --PreviewDuration, if

No specified, the default preview time is 10 seconds.

You can also add Watermarks with banners with Windows media meta files, and the yuan files also support insertion.

No gap-free flow switching.

□ program information

Use the getMediaInfostring method to return the following information of the related clip or show:

File name: File Name

Title: Title

Description: Description

Author: Author

Copyright: CopyRight

Level: Rating

URLS: Logo icon, Watermark, Banner's address

Clip information can be placed in a media file or in a Windows media meta file, or both. Such as

If you specify a clip message in the meta file, then the letter returned by the getMediaInfostring method is the letter in the meta file.

Interest, without returning the information contained in the clip.

In the meta file, additional information can be placed in each clip or program's Param tab. You can cut every cut

The memory adds any multiple param tabs to store custom information or link to the relevant site. In the Param tag

Information can be accessed through the getMediaParameter method.

The following properties return information about size and time:

ImageSourceHeight, ImageSourceWidth: Returns the display size of the image window;

Duration attribute, return the length of the clip (seconds), to detect if this property contains a valid value, please check

Isdurationvalid property. (For broadcast video, its length is unpredictable).

□ subtitle

You can use the .smi file to add subtitles for your program. The media player supports the following properties to handle subtitles:

SamiFileName attribute, specify the name of the .smi file; Samilang property, specify the language of the subtitle (use the first language if not specified);

SAMISTYLE attribute, the text size and style of the specified subtitle;

The showcaptioning property determines whether the subtitle display panel is displayed;

□ Script command

With the audio, video stream, you can join the script command in the streaming media file. The script command is a multimedia stream and special

Multi-to-peer Unicode string for time synchronization. The first string identifies the type of command to be commanded, and the second string specifies the command to be executed.

When the current is played to the script related time, the control sends a scriptcommand event to the web page, and then by the event

Processing process to respond to this event. The script command string will be passed to the event processor as the parameters of the script command event.

The media player automatically handles the following types of embedded scripts:

1) URL type command: When the media player control receives a URL type command, the specified URL will be loaded into the user.

The default browser. If the media player is embedded in an HTML file of a separate frame, the URL page can be loaded into the script command

The specified frame is within the specified frame. If the script command does not specify a frame, the URL page is loaded by the defaultFrame property.

Which frame is made.

You can decide if the URL type script command is automatically processed by setting the InvokeURLS property. If this

The value of the property is false, the media player control will ignore the URL type command. But the script command event will still trigger, this

Allow you to select the URL command.

The URL command is specified as the relative address of the URL. The base address is specified by the baseURL property. media Player

The command parameter of the script command event for the control is a link to a link.

2) FileName type command: When the media player control receives a filename type command, it will file filename

The property is set to the file provided by the script command, and then the media player will open this file to start playing. media Player

The control is always automatically processed by the filename command, not like the URL type command, which cannot be banned.

3) Text type command: When the media player control receives a Text type command, it will display the contents of the command

In the subtitle window of the control. The content can be plain text or HTML.

4) EVENT command: When the media player control receives an EVENT type command, it will in the media yuan file

Search the Name property of the EVENT element. If the Name property matches the second string in the script command, the media

The player control executes an entry contained in the EVENT element.

5) OpenEvent type command: When the media player control receives an OpenEvent type command, it will in the media

Check the EVENT element in the meta file and open the matching title, but do not play until it receives from the Event type command.

The real event with the same name.

□ Capture keyboard and mouse event

EnableContextMenu and Clicktoplay properties provide users with ways to operate in an image window.

If the EnableContextMenu property is True, right-click the mouse on the image window to open the associated menu, if

The Clicktoplay property is set to TRUE, and the user can click on the image window to play and pause switching.

To receive mouse movements and click event, send SendMouseMoveEvents and SendMouseClicKevents

The property is set to True. Mouse events are:

MouseDown, when the user presses the mouse;

MouseUp, when the user releases the mouse;

MouseMove, when the user moves the mouse; Click, when the user clicks on the media player;

DbClick, when the user doubles the mouse button on the media player;

To receive the keyboard event, set the SendKeyboardEvents property to True. Keyboard events are:

KeyDown, generates when the user presses a button;

Keyup, when the user releases a key;

KEYPRESS, when the user presses and releases a key;

□ Monitor flow status and network link

Stream status properties include:

PlayState: Playback status;

OpenState: Open status;

Bandwidth: bandwidth;

Supported events are:

OpenStateChange: Open Status change (triggered only when the sendopenStateChangeevents property is TRUE)

PlayStateChange: Playback status change (triggered only when the sendplayStateChangeevents property is TRUE)

Endofstream: Triggered at the end of the stream;

NewsTream: Trigger when opening new flow;

Network reception attributes include:

ReceptionQuality: Receive quality;

ReceivedPackets: The package already received;

LostPackets: lost package;

Monitoring the properties of the buffer are:

BufferingTime: buffering time;

BufferingCount: number of buffers;

BufferingProgress: buffer process;

Buffering: buffer event;

□ Error handling

The media player provides built-in error handling feature - displays the error message in the dialog or status bar. In addition, you

You can add an error handler yourself. If the senderRREvents property is set to TRUE, the error box will not be displayed.

Instead, send an error event; if the senderRorEvents property is set to false, the error box will be displayed, but it is faulty.

Error event.

Media player supports the following error processes:

Error event refers to hazardous errors;

WARNING event refers to an unhaneous error;

When your application receives an error event, you can detect the following properties to determine the specific error message:

Haserror: Check if the current media player is wrong;

ERRORCODE: Provides code values ​​related to this type of error;

ERRORDESCRIPTION: Provides error description information;

ErrorCorRection: Specifies the media player to correct the error;

□ Play CD

The media player treats the CD as a single audio stream with a marked at the beginning of each track. To use it in the web page

CD, you need to set the filename property to CDAUDIO:, you must have a colon, as shown below:

cd Audio Playback Example </ Title> </ head></p> <p><Body></p> <p><Object ID = "MediaPlayer"</p> <p>ClassID = "CLSID: 22D6F312-B0F6-11D0-94AB-0080C74C7E95" width = "320"</p> <p>HEIGHT = "508"</p> <p>Style = "Position: Absolute; Left: 0px; Top: 70px;">></p> <p><Param name = "filename" value = "CDAUDIO:"></p> <p><Param name = "autostart" Value = "0"></p> <p><Param name = "showControls" value = "1"></p> <p><Param name = "showstatusbar" Value = "1"></p> <p><Param name = "showdisplay" value = "1"></p> <p></ Object></p> <p></ Body></p> <p></ Html></p> <p>You can then play CD with a Play method.</p> <p>You can specify the play order and each track information in the Windows Media meta file. Examples are as follows:</p> <p><Asx v fort = "3.0"></p> <p><Title> cd Audio with the Media Player </ Title></p> <p><Author> Windows Media Technology </ author></p> <p><Copyright> (C) 1999, Microsoft, Inc. </ Copyright></p> <p><Entry></p> <p><Title> TRACK 1: Title 1 </ Title></p> <p><Ref hREF = "CDAUDIO:" /></p> <p><Startmarker number = "1" /></p> <p><Endmarker number = "2" /></p> <p></ Entry></p> <p><Entry></p> <p><Title> TRACK 2: Title 2 </ Title></p> <p><Ref hREF = "CDAUDIO:" /></p> <p><Startmarker number = "2" /></p> <p><Endmarker number = "3" /></p> <p></ Entry></p> <p><Entry></p> <p><Title> TRACK 3: Title 3 </ Title></p> <p><Ref hREF = "CDAUDIO:" /></p> <p><StartMarker Number = "3" /></p> <p><Endmarker number = "4" /></p> <p></ Entry></p> <p><Entry></p> <p><Title> TRACK 4: Title 4 </ Title></p> <p><Ref hREF = "CDAUDIO:" /></p> <p><Startmarker number = "4" /></p> <p></ Entry></p> <p></ Asx></p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-32458.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="32458" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.045</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = 'upAywY_2BS0B7dX_2Bqsg0vyNzuKfZHrr6icvCYY9046Ze74vm558c1tjqoeO_2Bk73V84uSnsM8C0Py07E13Ol6Ed2g_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>