0

I write HTML/JS code for HTML5 video player and have a error in Firefox 27.0.1 version, In Ubuntu/Windows Chrome in works, in IE11 it works.

HTML

<div id="newprogressBar" style="border:1px solid #aaa; color:#fff; width:295px; height:20px;"><span id="newprogress" style="background-color:#ff0000; height:20px; display:inline-block;"></span></div>

JS in HTML

var video = document.getElementById("videoPlayer"), (HTML5 <video *.mp4>)
newprogressBar = document.getElementById("newprogressBar");
newprogress = document.getElementById("newprogress");

Event function in JS

newprogressBar.addEventListener('click', function(event) {
width = parseFloat(newprogressBar.style.width);
var x = event.offsetX / width;  
video.currentTime = Math.round(x * video.duration);
}, false);

I have an error on this line in Firefox 

video.currentTime = Math.round(x * video.duration);

Error:

TypeError: Value being assigned to HTMLMediaElement.currentTime is not a finite floating-point value.

tinfoilboy
  • 926
  • 10
  • 17
Denis
  • 2,622
  • 3
  • 22
  • 24
  • 2
    What are `x` and `video.duration`? – Dennis Mar 01 '14 at 19:55
  • Sounds like it's NaNing. – bjb568 Mar 01 '14 at 19:57
  • 1
    Looks like a relevant question here: http://stackoverflow.com/questions/11334452/event-offsetx-in-firefox – Dennis Mar 01 '14 at 19:57
  • 1
    You should put console.log(width, x, x * video.duration) in your code to see what's going on. I'm sure one of those values is NaN. – Oscar Paz Mar 01 '14 at 19:59
  • NaN it's true, nut why only in firefox? x - it's temp variable for debug. I need to create navigation on video, i see where user click and do thing like this (Max width - selected) – Denis Mar 01 '14 at 20:09

1 Answers1

1

Check for .webm video file within video tag. Firefox on linux (also maybe on other OS) doesn't play .mp4 files.

purplemind
  • 71
  • 3