<!-- saved from url=(0085)https://www.jqueryscript.net/demo/Amazing-Music-Player-Plugin-with-jQuery-HTML5/demo/ -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
<! --<link rel="stylesheet" type="text/css" href="./www.jqueryscript.net_files/demo.css"> -->
<link rel="stylesheet" type="text/css"<script type="text/javascript" src="plugin/jquery.jplayer.js"></script>
<script type="text/javascript" src="plugin/ttw-music-player-min.js"></script>
<script type="text/javascript" src="plugin/myplaylist.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var description = 'http://www.jqueryscript.net/Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce id tortor nisi. Aenean sodales diam ac lacus elementum scelerisque. Suspendisse a dui vitae lacus faucibus venenatis vel id nisl. Proin orci ante, ultricies nec interdum at, iaculis venenatis nulla. ';
$('body').ttw-music-player(myplaylist, {
autoPlay: false,
description: description,
jPlayer: {
swfPath: 'plugin/jquery-jplayer'//You need to override the default swf path any time the directory structure changes
}
});
</script>
</head>
<body>
<div id="title"></div>
<a href="plugin/" id="download">
</a>
<div class="ttw-music-player" style="opacity: 1;">
<div class="player jp-interface">
<div class="album-cover">
<span class="img" style="opacity: 1;">
<img src="plugin /1.png" alt="album cover">
</span>
<span class="highlight"></span>
</div>
<div class="track-info">
<p class="title">Sample</p>
<p class="artist-outer" style="opacity: 1;">
By <span class="artist">Sample</span>
</p>
<div class="rating">
<span class="rating-level rating-star on"></span>
<span class="rating-level rating-star on"></span>
<span class="rating-level rating-star on"></span>
<span class="rating-level rating-star on"></span>
<span class="rating-level rating-star"></span>
</div>
</div>
<div class="player-controls">
<div class="main">
<div class="previous jp-previous"></div>
<div class="play jp-play" style="display: block;"></div>
<div class="pause jp-pause" style="display: none;"></div>
<div class="next jp-next"></div>
<!-- These controls aren't used by this plugin, but jPlayer seems to require that they exist -->
<span class="unused-controls">
<span class="jp-video-play" style="display: none;"></span>
<span class="jp-stop"></span>
<span class="jp-mute"></span>
<span class="jp-unmute" style="display: none;"></span>
<span class="jp-volume-bar"></span>
<span class="jp-volume-bar-value" style="width: 80%;"></span>
<span class="jp-volume-max"></span>
<span class="jp-current-time">00:15</span>
<span class="jp-duration">00:29</span>
<span class="jp-full-screen"></span>
<span class="jp-restore-screen" style="display: none;"></span>
<span class="jp-repeat"></span>
<span class="jp-repeat-off" style="display: none;"></span>
<span class="jp-gui"></span>
</span>
</div>
<div class="progress-wrapper">
<div class="progress jp-seek-bar" style="width: 100%;">
<div class="elapsed jp-play-bar" style="width: 52.6949%;"></div>
</div>
</div>
</div>
</div>
<p class="description showing">http://www.jqueryscript.net/Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce id tortor nisi. Aenean sodales diam ac lacus elementum scelerisque. Suspendisse a dui vitae lacus faucibus venenatis vel id nisl. Proin orci ante, ultricies nec interdum at, iaculis venenatis nulla. </p>
<div class="tracklist">
<ol class="tracks">
<li class="track playing">
<span class="title">Sample</span>
<span class="duration">0:30</span>
<span class="rating">
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar on"></span>
<span class="rating-level rating-bar"></span>
<span class="rating-level rating-bar"></span>
</span>
<a href="https://www.jqueryscript.net/demo/Amazing-Music-Player-Plugin-with-jQuery-HTML5/demo/#" class="buy" target="_blank">$0.99 BUY</a>
</li>
</ol>
<div class="more">View More...</div>
</div>
<div class="jPlayer-container" id="jp_jplayer_0" style="width: 0px; height: 0px;">
<img id="jp_poster_0" style="width: 0px; height: 0px; display: none;">
<audio id="jp_audio_0" preload="metadata" src="mix/1.mp3"></audio>
</div>
</div>
</body>
</html>