Seek bar not precise

[B-Stewart]

When you are choosing to seek or skip to a certain position of a video the bar does not always load to where your pointer is. If you seek to <50% the bar will load lower than where you click, if you seek to >50% then the bar will load higher than where you click (up to the point where it finishes the video when you wanted to go near the end). If you click at 50% it seems to be dead on accurate so I'm guessing it's a scaling issue of some sort. This is reproducible on your demo (http://mderrick.github.io/react-html5video/).

[mderrick]

Thanks for the issue. I am indeed aware of this problem, but it's just how range inputs work. In fact here is a link to the SO question I raised regarding it: https://stackoverflow.com/questions/33486311/custom-html5-range-input-and-handle-offset. If you yourself have a reasonable solution to this problem, I would love to get it fixed.

[Grsmto]

I think the only way to really fix this is to get rid of the range input to achieve the progress bar.
I guess you used the range input for accessibility reasons? (and because it makes sense).
How complex would it be to use a simple div and keep all of this accessible?
It seems like Youtube is using a div with custom JS for keyboard arrows support.

[mderrick]

Yes this would be the way to go. The range slider is a much simpler solution because it also has dragging for free which you'd also have to implement. I'd love to see this implemented as a third party repository acting as an alternative to the current seek bar component.