Skip to content

A CSS3 HTML5 audio player with a circular seekable progress bar and complete fallback

smcguinness/circleplayer

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

25 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CirclePlayer

CirclePlayer is a demo intended to showcase the jQuery HTML5 Media Library jPlayer https://github.com/happyworm/jPlayer

Try the latest version.

Uses HTML5 Audio, CSS3 Transforms (transform:rotate) hooks provided by : https://github.com/lrbabe/jquery.rotate.js

A full browser fallback is planned, jPlayer provides the Flash HTML5 Audio fallback and the idea is to use a sprite map to display progress in non CSS3 compliant browsers. http://modernizr.github.com/Modernizr/ could be used to check CSS3 transform:rotate compliance.

Possibilities exist to enhance the demo with https://wiki.mozilla.org/Audio_Data_API for supporting browsers.

Note the progress bar will not function correctly in Opera 11 due to a JIT compiler bug in the Opera browser : http://twitter.com/dstorey/status/28108260418523137

The demo's current look is heavily inspired by http://forrst.com/posts/Untitled-CJz

Thanks to Jussi Kalliokoski for contributing.

CirclePlayer is dual-licensed under the GPL and MIT licenses

About

A CSS3 HTML5 audio player with a circular seekable progress bar and complete fallback

Latest version is here : http://happyworm.com/jPlayerLab/circleplayer/

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%