title: html5 video countdown time left
body: <p>I ended up solving this issue by </p>
  
  <pre><code>   $oVideo.bind('timeupdate', function() {
     var currVideo = document.getElementById("vPlayer");
      //console.log(video.attr('id'));
     var iNow = currVideo.currentTime;
       //console.log(iNow);
     var countdown = eval(currVideo.duration - iNow);
       // countdown = countdown /3600;
     $('.decr-time').html('-' + rectime(countdown));
  
  
       if (!bTimeSlide) {
      $oTimeSlider.slider('value', iNow);
  
       }
    });
  </code></pre>
  
  <p>Hey I would like to thank anyone in advance. </p>
  
  <p>I need to create a countdown timer for an HTML5 video. Here is what I have been able to piece together. I really appreciate anyone who can help me figure this out. My console isn't showing errors for the countdown; but my countdown does not seem to be working. </p>
  
  <pre><code> //count down
    $oVideo.bind('duration', function() {
            var countdown = $oVideo.duration - $oVideo.currentTime;
              $down.text(rectime(countdown));
            if (! bTimeSlide)
                $oTimeSlider.slider('value', countdown);
          });
  </code></pre>
  
  <p>here is a snippit of the javaScript </p>
  
  <pre><code>        var $oMain = $(this);
          var $oVideo = $('video', $oMain);
          var $oTimeSlider = $('.time_slider', $oMain);
          var $oTimer = $('.timer', $oMain);
          var $down = ('.decr-time', $oMain);
          var bTimeSlide = false;
  
   //count up
          $oVideo.bind('timeupdate', function() {
            var iNow = $oVideo[0].currentTime;
              $oTimer.text(rectime(iNow));
              if (! bTimeSlide)
                  $oTimeSlider.slider('value', iNow);
          });
  
  
  
   ///count down
    $oVideo.bind('duration', function() {
            var countdown = $oVideo.duration - $oVideo.currentTime;
              $down.text(rectime(countdown));
            if (! bTimeSlide)
                $oTimeSlider.slider('value', countdown);
          });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;section class="content-wrapper"&gt;
          &lt;div class="video_player"&gt;
              &lt;video controls&gt;
                 &lt;source src="../assets/video.mp4" type="video/mp4" /&gt;
                  &lt;source src="../assets/video.webm" type="video/webm" /&gt;
                  &lt;source src="../assets/video.ogv" type="video/ogg" /&gt;
              &lt;/video&gt;
                  &lt;div class="custom_controls"&gt;
                        &lt;a href="index.html" title="Back" class="back-button"&gt;&lt;/a&gt;
                        &lt;a class="play" title="Play"&gt;&lt;/a&gt;
                        &lt;a class="pause" title="Pause"&gt;&lt;/a&gt;
                        &lt;div class="timer"&gt;00:00&lt;/div&gt;
                        &lt;div class="time_slider"&gt;&lt;/div&gt;
                         &lt;div class="decr-time"&gt;-00:00&lt;/div&gt;
                        &lt;/div&gt;
              &lt;/div&gt;
        &lt;/section&gt;
  </code></pre>