onseek Event

  • Article

This topic documents a feature of HTML+TIME 2.0, which is obsolete as of Windows Internet Explorer 9.

Fires whenever a seek operation is performed on the element.

Syntax

Inline HTML <ELEMENT onseek = "handler(event);" >
Event Property object.onseek = handler;
attachEvent object.attachEvent( "onseek", handler);
Named script <SCRIPT FOR = object EVENT = onseek>

Event Information

Bubbles No
Cancels No
To invoke Open a page in the browser that contains a media file affected by Introduction to HTML+TIME. Call one of the seek methods, such as seekTo, seekToFrame or seekActiveTime.
Default action Calls the associated event handler.

Event Object Properties

Although event handlers in the DHTML Object Model do not receive parameters directly, a handler can query the event object for the following event properties.

Available Properties

srcElement Gets or sets the object that fired the event.
type Gets or sets the event name from the event object.

Refer to the specific event object for additional event properties.

Example

This example demonstrates how to use the onseek event. The onseek event fires when either the seekTo, seekToFrame or seekActiveTime method is called upon a media object. Before validating and implementing the value to seek, make sure the object is active to avoid receiving an error message. In this example, if the object is not active the beginElement method is called to restart the object, followed by the request to seek. Choose a method to use from the drop-down menu and enter a value in the input box. Click the button labelled 'Click to seek'. The media object seeks to the value entered and pauses. Click the 'Resume' button to resume the video from that point.

<HTML xmlns:t= "urn:schemas-microsoft-com:time">
<HEAD>

<?IMPORT namespace="t" implementation="#default#time2">
<STYLE>
    .time{behavior:url(#default#time2)}
</STYLE>
<SCRIPT>
function doSeek(){
    var maxlength;
    //What is the maximum value that the user can input.
    //There are a total of 597 frames in the video with duration of 20.06205
        //seconds.
    switch(oMethod.options.selectedIndex){
        case 0: maxlength = oMedia.mediaDur;
            break;
        case 1: maxlength = oMedia.mediaDur;
            break;
        case 2: maxlength = 598;
            break;
    }
    //Is media object active?
    //Yes, continue and do seek.
    //No, restart element using the beginElement method.
    if(!oMedia.currTimeState.isActive){
        oMedia.beginElement();
    }
    //Is user input valid and within the media's duration boundaries?
    if(isFinite(seekInput.value) && seekInput.value > 0 && seekInput.value < maxlength){
        switch(oMethod.options.selectedIndex){
            case 0: oMedia.seekTo(1, seekInput.value);
                break;
            case 1: oMedia.seekActiveTime(seekInput.value);
                break;
            case 2: oMedia.seekToFrame(seekInput.value);
                break;
        }
        oMedia.pauseElement();
    }else{
        //Input is not valid, alert user to re-enter choice.
        switch(oMethod.options.selectedIndex){
            case 0:
                alert("Please enter a valid integer. Value must be greater" +
                    " than 0 and less than " + oMedia.mediaDur + ".");
                break;
            case 1: 
                alert("Please enter a valid integer. Value must be greater" +
                    " than 0 and less than " + oMedia.mediaDur + ".");
                break;
            case 2: 
                alert("Please enter a valid integer. Value must be greater" +
                    " than 0 and less than 597.");
                break;
        }
        seekInput.focus();
    }
}
function fn_doseek(flag){
    //Is the function being called from the onseek event?
    if(flag){
        resumeBtn.style.visibility = "visible";
        seekBtn.style.visibility = "hidden";
        restartBtn.style.visibility = "hidden";
    //Function is being called from the resumeBtn.        
    }else{
        resumeBtn.style.visibility = "hidden";
        seekBtn.style.visibility = "visible";
        restartBtn.style.visibility = "visible";
        oMedia.resumeElement();
        seekInput.value="";
    }
}      
</SCRIPT>
</HEAD>

<BODY>        
<CENTER>
<B>Media timer:</B>
<SPAN id="Timer2" class="time" dur=".01" repeatCount="indefinite" fill="hold"
    onrepeat="innerText=parseInt(oMedia.currTimeState.activeTime);">0</SPAN>
<BR><BR>
<t:video onseek="fn_doseek(true);" style="width:175px; height:150px;"
    id="oMedia" src="/workshop/samples/author/behaviors/media/movie.avi"/>
<BR><BR>
<B>Choose method:</B>&nbsp;<SELECT name="oMethod">
<OPTION value="seekTo" selected>seekTo</OPTION>
<OPTION value="seekActiveTime">seekActiveTime</OPTION>
</SELECT>
<BR>
<B>Time value to seek in object's timeline</B>: 
    <INPUT type="text" value="" name="seekInput" size="3"/>&nbsp;seconds
<BR><BR>
<BUTTON id="seekBtn" onclick="doSeek();">Click to seek</BUTTON>
<BUTTON id="resumeBtn" onclick="fn_doseek(false);"
    style="visibility:hidden;">Resume</BUTTON>
<BUTTON id="restartBtn" onclick="oMedia.beginElement()">Restart</BUTTON>

</CENTER>
</BODY>
</HTML>

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/behaviors/onseek.htm

Applies To

t:TRANSITIONFILTER, t:ANIMATION, t:AUDIO, t:EXCL, t:IMG, t:MEDIA, t:PAR, t:REF, t:SEQ, time2, t:VIDEO

See Also

Introduction to HTML+TIME