timevideo.js

Show the current time of the video, instead of the remaining time on videojs


I use VideoJS, a HTML5 video player

By default it displays the remaining time (countdown) instead of the normal current time (like youtube)

Any ideas how to "fix" it? You can see a live example at their official website


Solution

  • For other people that search for a solution...

    All timers exist on the player but by default the current-time, time-divider and the duration info are hidden with display: none;.

    So the only thing we have to do is hide the remaining-time and show the time-control which includes the current-time, time-divider and the duration.

    The solution in CSS code that should work with your player:

    .video-js .vjs-time-control {
        display: block;
    }
    .video-js .vjs-remaining-time {
        display: none;
    }
    

    player-with-time-control

    The documentation does not explain this, or to be precise it fails to explain it when it explains how to customize your player with CSS.


    Fast html code snippet:

    <style type="text/css">
        .video-js .vjs-time-control{display: block;}
        .video-js .vjs-remaining-time{display: none;}
    </style>