Results 1 to 3 of 3

Thread: Make the MP3's stop with either a click or a new button

  1. #1
    Join Date
    Oct 2012
    Location
    England
    Posts
    98
    Thanks
    27
    Thanked 2 Times in 1 Post

    Default Make the MP3's stop with either a click or a new button

    Hi,

    I know this is a problem that has been discussed on here before but I've tried looking at the replies to previous posts and can't get mine to work.

    Basically I want a picture of children as a hotspot and when you click on their faces it plays an MP3...

    HTML Code:
    <html>
    <head>
    <bgsound src="#" id="soundeffect" loop=1 autostart="false" />
    
    
    
    
    
    
    
    
    
    
    
    
    <script type="text/javascript">
    
    /***********************************************
    * JavaScript Sound effect-  Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
    * This notice must stay intact for legal use
    ***********************************************/
    
    var soundfile="http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song1.mp3" //path to sound file, or pass in filename directly into playsound()
    
    var soundfile="http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song2.mp3" //path to sound file, or pass in filename directly into playsound()
    
    var soundfile="http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song3.mp3" //path to sound file, or pass in filename directly into playsound()
    
    var soundfile="http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song4.mp3" //path to sound file, or pass in filename directly into playsound()
    
    var soundfile="http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song5.mp3" //path to sound file, or pass in filename directly into playsound()
    
    function playsound(soundfile){
    if (document.all && document.getElementById){
    document.getElementById("soundeffect").src="" //reset first in case of problems
    document.getElementById("soundeffect").src=soundfile
    }
    }
    
    function bindsound(tag, soundfile, masterElement){
    if (!window.event) return
    var source=event.srcElement
    while (source!=masterElement && source.tagName!="HTML"){
    if (source.tagName==tag.toUpperCase()){
    playsound(soundfile)
    break
    }
    source=source.parentElement
    }
    }
    
    </script>
    
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    <title>poems test</title>
    </head>
    <body>
    
    <img src="http://www.bigwood.nottingham.sch.uk/wp-content/uploads/2013/library/sooty.jpg" width="338" height="220" border="0" usemap="#Map" />
    <map name="Map" id="Map"><area shape="poly" coords="332,189,313,90,327,42,285,12,249,35,252,80,246,98,235,167,238,203,316,200" onClick="playsound('http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song1.mp3')">
    
    
    <area shape="poly" coords="213,188,194,89,208,41,166,11,130,34,133,79,127,97,116,166,119,202,197,199" onClick="playsound('http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song2.mp3')">
    
    
      <area shape="poly" coords="102,194,83,95,97,47,55,17,19,40,22,85,16,103,5,172,8,208,86,205" onClick="playsound('http://www.bigwood.nottingham.sch.uk/VLE/audio_player/song3.mp3')">
    </map>
    
    
    
    
    </body>
    </html>
    but I weant it to stop if I click on a button...

    OR would it be easier to have it so that you have a Mouseover as a play option and the click as a stop / mute option?

    OR... have the onClick option on the childrens faces but another OnClick on a button that stops the sound?

    I've looked at some of the sample solutions on similar queries but not maneged to get mine to work.

    Thanks,



    Jay Dog

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,998
    Thanks
    16
    Thanked 315 Times in 313 Posts
    Blog Entries
    12

    Default

    I'm not sure which script you're using (you've forgotten the link) but from a usability angle I think starting the songs with a click would be better than a mouseover - folks with motor skill issues, or even just under the steam of an enthusiastic swipe, will likely produce an undesirable cacophony of noise as they move the mouse over a sea of faces.

    Similarly, an obvious onclick "stop" button I think would also be useful.

    Not wanting to dissuade you from what you have so far, but an alternative script option could be SoundManager2: http://www.schillmania.com/projects/soundmanager2/
    A bit more info here: http://www.dynamicdrive.com/forums/s...218#post209218
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  3. #3
    Join Date
    Oct 2012
    Location
    England
    Posts
    98
    Thanks
    27
    Thanked 2 Times in 1 Post

    Default

    Thanks Bev...

    the link is here http://www.bigwood.nottingham.sch.uk...speaking-poems

    The image and the mp3's are not the final versions, I haven't taken the pics of the kids or recorded them but that's what I'm aiming for (the top version)

    I'll put a simple blurb about 'Click on a pupils face to hear their poem'

    but a STOP button would be a good idea, but I simply don't know how to do that.

    I'll have a play with script before end of day but if you do know and it only takes 5 mins to type it that'd be really appreciated. Thanks


    Jay Dog

Similar Threads

  1. Replies: 0
    Last Post: 03-11-2011, 08:20 PM
  2. Replies: 1
    Last Post: 08-11-2009, 11:39 PM
  3. Stop animation with 1 click
    By the1knight in forum Looking for such a script or service
    Replies: 9
    Last Post: 06-03-2007, 03:02 AM
  4. Replies: 0
    Last Post: 10-16-2005, 11:23 PM
  5. Stop a embedded sound with a link (not with a stop-button)
    By pepito in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 10-16-2005, 11:23 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •