CODEWITHSUNDEEP
javascriptyoutube
pyxl
pyxl

Reputation: 255

Get the Progressbar from youtube video

I need the Progress/Buffer bar from a youtube video.

My current solution is:

I have a own "bar", with width of 400px. Then i choose the videolenght and divide the 400px by the videotime.

Then i have how much px for 1sec. And now, i have a setInterval for every second, and for the general of my own progress bars to the width is added.

Is the video paused/stoped, i cleared the interval. If the video played resume, the interval continues. But my question is, is this a good way for performance? Is there any other solutions?

I use this plugin http://www.tikku.com/jquery-youtube-tubeplayer-plugin

Upvotes: 0

Views: 1057

Answers (1)

Jonn
Jonn

Reputation: 1674

If you know the current time of the player, the duration of the video, and the desired full width of the progressbar, you can use a simple jQuery animation.

var currentTime, duration, fullBarWidth;

$("#progressbar").animate(
    {
        width: fullBarWidth
    },
    {
        duration: duration - currentTime,
        easing: "linear",
        queue: false
    }
);

When the player pauses the video, call $("#progressbar").stop(); to pause the progressbar animation.

You may also want to take a look at Google's new Youtube Javascript API. It may be easier to work with. https://developers.google.com/youtube/js_api_reference

Upvotes: 1

Related Questions