jQuery Help with audio play and pause using jQuery.

[jerrell]

Hello,

I am attempting to "play" and "pause" music on my page when the #startbutton is clicked ... I also have a volume button #volume that I want to use to turn the music off and on. I am using jQuery to make this possible, below is the jQuery code.

I can also provide the HTML if need. Thank you in advance for ALL your help.

 

$(function() {

    //
 	var $volume = $( '#startbutton' );
    var $fsound =  $('#fsound');
    $fsound.hide();
    buzz.defaults.formats = [ 'ogg', 'mp3' ];
    

	//
	var s = null,
	
	AnimationSpace = {
		settings: {
			startButton: $("#startbutton");

		},
		
		init: function() {
			s = this.settings;
			this.startAnimation();
		},
		
		startAnimation: function () {
			s = this.settings;
			
			s.startButton.click(function() {
				$("div.target").toggleClass("animate");
				if (s.startButton.attr("value") === "ANIMATE THE SCENE") {
					s.startButton.attr("value", "RESET THE ANIMATION");				
				} else {
					s.startButton.attr("value", "ANIMATE THE SCENE");	
				}
				
				//
			var Sound = new buzz.sound( 'audio/birthday' );
				if ( !buzz.isSupported() ) {
      				$volume.hide();
        			$fsound.visible();   
    			}else{
    				Sound.loop().play().fadeIn( 5000 );
				}
	
   			 $volume.click( function() {
        		if ( $( this ).hasClass( 'all' ) ) {
             		Sound.mute();
             $( this ).removeClass( 'all' ).addClass( 'none' );
        		} else if ( $( this ).hasClass( 'none' ) ) {
           			Sound.unmute();
             $( this ).removeClass( 'none' ).addClass( 'all' );
       			}
        		return false;
    		});	
				//
				
				
			});
		}

	};

	AnimationSpace.init();
});

[jerrell]

I was able to put together a solution for the problem I was having... still a few bugs but in case anyone else runs into this problem. Here is the working code (with minor bugs).

$( function() {
    var $volume = $( '#volume' );
    var $start = $('#startbutton');
       
    buzz.defaults.formats = [ 'ogg', 'mp3' ];

    var Sound = new buzz.sound( 'audio/birthday' );
        
$start.click(function(){
    if ( !buzz.isSupported() ) {
                   
    }else{
    
    Sound.play().fadeIn( 5000 );
	}
    });
    // Volume button

    $volume.click( function() {
        if ( $( this ).hasClass( 'all' ) ) {
             Sound.mute();
         
            $( this ).removeClass( 'all' ).addClass( 'none' );
        } else if ( $( this ).hasClass( 'none' ) ) {
           
            Sound.unmute();
        
            $( this ).removeClass( 'none' ).addClass( 'all' );
        }
        return false;
    });

});