HTML 5 – Play file at certain time point

by

The best way to do this is to use the Media Fragment URI specification. Using your example, suppose you want to load the audio starting at 3:26 in.

<audio id="audio2" 
       preload="auto" 
       src="file.mp3#t=00:03:26" 
       oncanplaythrough="this.play();">
</audio>

Alternatively, we could just use the number of seconds, like file.mp3#t=206.

You can also set an end time by separating the start from the end times with a comma. file.mp3#t=206,300.5

This method is better than the JavaScript method, as you’re hinting to the browser that you only want to load from a certain timestamp. Depending on the file format and server support for ranged requests, it’s possible for the browser to download only the data required for playback.

See also:

More Related Contents:

  1. HTML5 audio playlist – how to play a second audio file after the first has ended?
  2. jQuery append function is just appending the html but not the classes related to it
  3. jQuery .animate function not responding properly
  4. How to decode HTML entities using jQuery?
  5. jQuery/JavaScript collision detection
  6. Reload an iframe with jQuery
  7. jQuery click not working for dynamically created items [duplicate]
  8. Stop setInterval
  9. Finding line-wraps
  10. How to make a simple image upload using Javascript/HTML
  11. Creating a jQuery object from a big HTML-string
  12. make html text input field grow as I type?
  13. Can javascript access iframe elements from the parent page?
  14. get a list of all folders in directory [closed]
  15. Is it OK to add your own attributes to HTML elements? [duplicate]
  16. Scale a div to fit in window but preserve aspect ratio
  17. Possible to associate label with checkbox without using “for=id”?
  18. How to localize a simple HTML website page in my case?
  19. Submit form after calling e.preventDefault()
  20. jQuery in Chrome returns “block” instead of “inline”
  21. Close a div by clicking outside
  22. Change form values after submit button pressed
  23. JavaScript on the bottom of the page?
  24. How to write into a file (in user directory) using JavaScript?
  25. Web browser: Hide mouse cursor [duplicate]
  26. Prevent iOS bounce without disabling scroll ability
  27. ToggleClass animate jQuery?
  28. How to set the loudness of HTML5 audio?
  29. Fire oninput event with jQuery
  30. canvas- Cropping images in different shapes

Leave a Comment