12: <script src="js/jquery-1.10.2.min.js"></script> 1:
2: <!-- jQuery Plugin -> jPlayer -->
3: <link href="css/jsPlayerSkinning/blue.monday/jplayer.blue.monday.css" rel="stylesheet" />
4: <script type="text/javascript" src="js/jquery.jplayer.min.js">
1: </script>
2: <!-- jPlayer Plugin -> Playlist Plugin -->
3: <script type="text/javascript" src="js/jplayer.playlist.min.js">
1: </script>
2:
3: <!-- </Plugin Tree> -->
4: </head>
5:
6: <body>
7: <div id="MeinPlayerContainer" class="jp-video jp-video-270p">
8: <div class="jp-type-playlist">
9: <div id="MeinMp3Player" class="jp-jplayer"></div>
10: <div class="jp-gui">
11: <div class="jp-video-play">
12: <a href="javascript:;" class="jp-video-play-icon" tabindex="1">play</a>
13: </div>
14: <div class="jp-interface">
15: <div class="jp-progress">
16: <div class="jp-seek-bar">
17: <div class="jp-play-bar"></div>
18: </div>
19: </div>
20: <div class="jp-current-time"></div>
21: <div class="jp-duration"></div>
22: <div class="jp-controls-holder">
23: <ul class="jp-controls">
24: <li><a href="javascript:;" class="jp-previous" tabindex="1">previous</a></li>
25: <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
26: <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
27: <li><a href="javascript:;" class="jp-next" tabindex="1">next</a></li>
28: <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
29: <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
30: <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
31: <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
32: </ul>
33: <div class="jp-volume-bar">
34: <div class="jp-volume-bar-value"></div>
35: </div>
36: <ul class="jp-toggles">
37: <li><a href="javascript:;" class="jp-full-screen" tabindex="1" title="full screen">full screen</a></li>
38: <li><a href="javascript:;" class="jp-restore-screen" tabindex="1" title="restore screen">restore screen</a></li>
39: <li><a href="javascript:;" class="jp-shuffle" tabindex="1" title="shuffle">shuffle</a></li>
40: <li><a href="javascript:;" class="jp-shuffle-off" tabindex="1" title="shuffle off">shuffle off</a></li>
41: <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
42: <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
43: </ul>
44: </div>
45: <div class="jp-title">
46: <ul>
47: <li></li>
48: </ul>
49: </div>
50: </div>
51: </div>
52: <div class="jp-playlist">
53: <ul>
54: <li></li>
55: </ul>
56: </div>
57: <div class="jp-no-solution">
58: <span>Update Required</span>
59: To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
60: </div>
61: </div>
62: </div>
63:
64: <script>
65: $(function ()
66: { 67:
68: var myPlaylist = new jPlayerPlaylist({ 69: jPlayer: "#MeinMp3Player",
70: cssSelectorAncestor: "#MeinPlayerContainer"
71: },
72: [
73: { 74: title: "Last Christmas",
75: artist: "Wham",
76: mp3: "/Musik/Wham - Last Christmas.mp3"
77: }
78: ],
79: { 80: playlistOptions:
81: { 82: enableRemoveControls: true
83: },
84: swfPath: "js",
85: supplied: "webmv, ogv, m4v, oga, mp3",
86: audioFullScreen: true
87: });
88:
89: myPlaylist.add({ 90: title: "Looking for Freedom",
91: artist: "David Hasselhoff",
92: mp3: "/Musik/David Hasselhoff - Looking for Freedom.mp3"
93: });
94:
95: });
96:
</script>