How to stop MP3 player automatically playing next song
Hi, this is something I've been working on based on Beverly's help (thanks!)for the History Department at school:
http://www.bigwood.nottingham.sch.uk...newaudio1.html
My problem is that the MP3 player plays song1 then when that's done it plays song2. This is OK if you were actually playing an album of music but as it's history podcasts, children only need to hear the specific podcast that they need to.
Is there a way of making it so that it stops automatically playing the next podcast?
Thanks,
Jay Dog
HTML Code:<!DOCTYPE html> <html> <head> <title>Nazi Germany Podcasts</title> <style type="text/css"> html, body { margin:0; height:100%; width:100%; text-align:center; } body { background:#000; font:12px lucida sans unicode, arial; color:#000000; background-color: #FFF; } a:link, a:active, a:visited { color:#000000; text-decoration:none; } a:hover { color:#fff; text-decoration:underline; } #wrapper { position:relative; width:650px; height:150px; top:50%; margin:-100px auto 0 auto; } #url { position:absolute; left:89px; top:10px; font:11px arial; } #Jemplayer { position:absolute; left:10px; top:20px; } #Jemplayer a img { height:27px; width:27px; border:0; } #player-base { position:absolute; left:2px; top:2px; width:620px; height:162px; } #pause, #play, #prev, #next, #stop { position:absolute; top:122px; } #pause { left:157px; } #play { left:183px; } #prev { left:209px; } #next { left:235px; } #stop { left:262px; } #player { position:absolute; top:36px; left:28px; width:135px; height:135px; } #player a { font:13px Lucida Sans Unicode; } #tag { position:absolute; left:23px; top:130px; } #playlist { width:300px; height:225px; border:1px solid red; } #playlist { position:absolute; left:320px; top:45px; width:500px; height:110px; overflow:auto; text-align:left; line-height:19px; padding:0 10px 0 22px; border:0px solid red; } #playlist a:hover { text-decoration:none; } #playlist a:after { content:""; display:inline-block; width:0; height:0; border-right:0; border-left:8px solid #000000; border-bottom:5px solid transparent; border-top:5px solid transparent; margin-left:10px; } #playlist a:hover:after { border-left:8px solid #fff; } #playlist ol { margin:0 0 0 -23px; font-size:11px; width:100%; } .styled-v-bar { background:rgba(255,0,179,0.2); margin-right:-5px; } .styled-v-bar ins { background:rgba(255,0,179,0.2); } </style> <!-- Jem Player --> <script type="text/javascript" src="swfobject.js"></script> <script type="text/javascript" src="swfmacmousewheel.js"></script> <script type="text/javascript"> // these functions are caught by the JavascriptView object of the player. function sendEvent(typ,prm) { thisMovie("mpl").sendEvent(typ,prm); }; function getUpdate(typ,pr1,pr2,pid) { if(typ == "time") { currentPosition = pr1; } else if(typ == "volume") { currentVolume = pr1; } else if(typ == "item") { currentItem = pr1; setTimeout("getItemData(currentItem)",100); } var id = document.getElementById(typ); id.innerHTML = typ+ ": "+Math.round(pr1); pr2 == undefined ? null: id.innerHTML += ", "+Math.round(pr2); if(pid != "null") { document.getElementById("pid").innerHTML = "(received from the player with id <i>"+pid+"</i>)"; } }; // This is a javascript handler for the player and is always needed. function thisMovie(movieName) { if(navigator.appName.indexOf("Microsoft") != -1) { return window[movieName]; } else { return document[movieName]; } }; </script> <!-- Playlist Scroller --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> <script type="text/javascript" src="jquery.ui.touch-punch.min.js"></script> <!-- FaceScroll custom scrollbar (c) Dynamic Drive - http://www.dynamicdrive.com/dynamicindex11/facescroll/index.htm --> <script type="text/javascript" src="facescroll.js"></script> <script type="text/javascript"> jQuery(function(){ // on page DOM load $('#playlist').alternateScroll({'vertical-bar-class':'styled-v-bar','hide-bars':false}); }) </script> <meta charset="utf-8"> </head> <body> <div id="wrapper"> <div id="Jemplayer"> <img id="player-base" src="images/proposedradio.png"> <a id="pause" href="javascript:sendEvent('playpause')" title="pause / play"> <img src="images/transparent.gif" onmouseover="this.src='images/button-pause-mini.gif'" onmouseout="this.src='images/transparent.gif'"> </a> <a id="play" href="javascript:sendEvent('playitem',0)" title="play (shuffle)"> <img src="images/transparent.gif" onmouseover="this.src='images/button-play-mini.gif'" onmouseout="this.src='images/transparent.gif'"> </a> <a id="prev" href="javascript:sendEvent('prev')" title="previous"> <img src="images/transparent.gif" onmouseover="this.src='images/button-rewind-mini.gif'" onmouseout="this.src='images/transparent.gif'"> </a> <a id="next" href="javascript:sendEvent('next')" title="next"> <img src="images/transparent.gif" onmouseover="this.src='images/button-fastforward-mini.gif'" onmouseout="this.src='images/transparent.gif'"> </a> <a id="stop" href="javascript:sendEvent('stop')" title="stop"> <img src="images/transparent.gif" onmouseover="this.src='images/button-stop-mini.gif'" onmouseout="this.src='images/transparent.gif'"> </a> </div> <div id="player"> <center><a href="http://www.macromedia.com/go/getflashplayer">Get the latest Flash Player</a></center> <script type="text/javascript"> var so = new SWFObject('mediaplayer.swf','mpl','135','135','8'); so.addParam('allowfullscreen','true'); so.addParam('allowscriptaccess','true'); so.addVariable('displayheight','135'); so.addVariable('file','playlist.xml'); so.addVariable('height','135'); so.addVariable('width','135'); so.addVariable('autostart','false'); so.addVariable('showvolume','false'); so.addVariable('repeat','list'); so.addVariable('shuffle','false'); so.addVariable('volume','100'); so.addVariable('enablejs','true'); so.addVariable('javascriptid','mpl'); so.addVariable('showeq','true'); so.addVariable('showicons','false'); so.addVariable('image','images/preview.jpg'); so.addVariable('overstretch','fit'); so.addVariable('screencolor','FFFFFF'); so.write('player'); var mmw = new SWFMacMouseWheel(so); </script> </div> <div id="playlist"> <ol><li><img src="images/blank.png" width="325" height="26"></li> <li><a href="javascript:sendEvent('playitem',1)">The Treaty of Versailles</a></li> <li><a href="javascript:sendEvent('playitem',2)">The Weimar Republic</a></li> <li><a href="javascript:sendEvent('playitem',3)">Hyperinflation - The Causes of</a></li> <li><a href="javascript:sendEvent('playitem',4)">Hyperinflation - How was it solved?</a></li> <li><a href="javascript:sendEvent('playitem',5)">What were the problems of the Weimar government</a></li> <li><a href="javascript:sendEvent('playitem',6)">The Munich Putsch</a></li> <li><a href="javascript:sendEvent('playitem',7)">How did the Nazi Party change from 1924 to 1929</a></li> <li><a href="javascript:sendEvent('playitem',8)">How did the Great Depression help the Nazi Party</a></li> <li><a href="javascript:sendEvent('playitem',9)">Why did the German people vote for the Nazi Party</a></li> </ol> </div> </div> </body> </html>
CSS Codes
Bookmarks