Icontem

File: example.html

Recommend this page to a friend!
  Classes of Harish Chauhan  >  HTML5 Circle Audio Player  >  example.html  >  Download  
File: example.html
Role: Example script
Content type: text/plain
Description: Sample output
Class: HTML5 Circle Audio Player
Make HTML5 audio players appear as circles
Author: By
Last change:
Date: 4 years ago
Size: 1,545 bytes
 

Contents

Class file image Download
<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Circle Audio Player</title>
  <script src="lib/jquery.min.js"></script>
  <script src="src/jquery.circle-audio-player.js"></script>
  <script src="src/jquery.circle-audio-player-skins.js"></script>
 </head>
 <body>
     <audio controls preload="auto" data-radius="40" data-skin="plane" data-circle-audio-player>
        <source src="Ringtone - Khoya khoya chand.mp3" type="audio/mpeg">
        Your browser does not support the audio element.
      </audio>

     <audio controls preload="auto" data-circle-audio-player>
        <source src="Ringtone - Khoya khoya chand.mp3" type="audio/mpeg">
        Your browser does not support the audio element.
      </audio>

     <audio controls preload="false" data-radius="200" data-skin="green" data-circle-audio-player>
        <source src="http://cdn.dj-punjab.info/songs/128/553/Aaye%20Ho%20Meri%20Zindagi%20Mein%20(RaagJatt.com).mp3" type="audio/mpeg">
        Your browser does not support the audio element.
      </audio>

     <audio controls preload="auto" data-skin="black" data-circle-audio-player>
        <source src="Ringtone - Khoya khoya chand.mp3" type="audio/mpeg">
        Your browser does not support the audio element.
      </audio>
     
     <audio controls preload="auto" data-skin="glossy" data-radius="130" data-circle-audio-player>
        <source src="Ringtone - Khoya khoya chand.mp3" type="audio/mpeg">
        Your browser does not support the audio element.
      </audio>
 </body>
</html>