CODEWITHSUNDEEP
javascriptjqueryjquery-uihtml5-videojwplayer
Hitesh
Hitesh

Reputation: 4298

how to move slider as video is being moved

I am doing a customized control bar. right now i am working on seek bar .i am able to play video on that particular time as the seek bar is moved . Now i need to do the vice versa that is . when my video is being played seekbar should automatically move i got tired of searching through google . i know there are great number of intelligent people are in stack overflow . help me ,give me some idea sothat i can start again

i am kind of stuck here

thanks for your help :) my code is here in this link how to make custom seek bar for player in jwplayer

and i am including here as well

$(document).ready(function() {



 var videoLength;

function setPosition(myPosition ) {


jwplayer().seek(myPosition);
}


// finding durartion of the video 



 jwplayer().onTime(function(event){

                                          jwplayer().play();
                                          jwplayer().pause();
                                          videoLength=event.duration;

                                          seek(videoLength);

                                          });



         function seek(pos)
{

  var position = Math.round(pos);
   $("#volume").slider({
    min: 0,
    max:position,
    value: 0,
        range: "min",
        animate: true,
      slide: function(event, ui) {
      var range = $( ".selector" ).slider( "option", "range" );
      setPosition(ui.value);
    }
  });

}                                        
 });
jwplayer code

<script type="text/javascript">

    var trackpathEn = "myCaptionsEn.vtt";
    var trackpathEn = "myCaptionsEn.vtt";
    var trackpathJa = "myCaptionsJa.vtt";
    jwplayer('player').setup({
    flashplayer: './jwplayer.flash.swf',
    file: 'example1.mp4',
    skin: "./skins/six/six.xml",
    controls: false,

    tracks: [
     { file: trackpathEn, back: false,color: 'cc0000', fontsize: 20 , label: "English", kind: "subtitles",default:true },
     { file: trackpathJa, back: false,color: 'cc0000', fontsize: 20 , label: "Japanese", kind: "subtitles" },


    ] 
  });

Upvotes: 4

Views: 1276

Answers (1)

Hitesh
Hitesh

Reputation: 4298

hey i found the way

thanks guys all for your help 

$("#seekBar").slider('option', 'value',slider_range);

just make sure that your passing right value in "slider_range"..after calculation and it must be integer:)

Upvotes: 2

Related Questions