马先洁

容器定律——Super concise formula(SCF)超简洁公式探索者!

audio最简单原始的播放、暂停、停止、静音、音量大小控制的功能,注意某些浏览器会有权限无法自动播放噢(video也会如此)

 

JS代码:

 1 //注意某些浏览器有权限无法自动播放
 2 //声音控制
 3 var my_audio={
 4     obj:null,
 5     is_auto_play:false,
 6     is_loop:false,
 7     set:function(a){
 8         var self=this;
 9         self.obj=new Audio(a.url);
10         if(a.auto){
11             self.is_auto_play=true;
12             self.play();
13         }
14         if(a.loop){
15             self.is_loop=true;
16         }
17     },
18     play:function(){
19         var self=this;
20         self.obj.play();
21         if(self.is_loop){
22             self.obj.onended = function() {
23                 self.play();
24             };
25         }
26     },
27     pause:function(){
28         var self=this;
29         self.obj.pause();
30     },
31     stop:function(){
32         var self=this;
33         self.obj.pause();
34         self.obj.currentTime = 0.0; 
35     },
36     muted:function(){
37         var self=this;
38         self.obj.muted ? self.obj.muted = false : self.obj.muted = true; 
39     },
40     volume_add:function(){
41         var self=this;
42         self.obj.volume = self.obj.volume + 0.1; 
43     },
44     volume_minus:function(){
45         var self=this;
46         self.obj.volume = self.obj.volume - 0.1; 
47     },
48     init:function(a){
49         var c = function(s) { 
50             var r={};
51             for (var k in s) {
52                 r[k] = typeof s[k]==="object" ? c(s[k]) : s[k];
53             } 
54             return r; 
55         }
56         var self =  c(my_audio);
57         self.set(a);
58         return self;
59     }
60 }
61 
62 var audio_bg=my_audio.init({url:"video/bg.mp3",auto:true});
63 var audio_gift=my_audio.init({url:"video/gift.mp3",loop:true});
64 var audio_bomb=my_audio.init({url:"video/bomb.mp3"});

 

HTML代码:

 1 <a href="javascript:audio_bg.play();">播放背景</a>
 2 <a href="javascript:audio_bg.pause();">暂停背景</a>
 3 <a href="javascript:audio_bg.stop();">停止背景</a>
 4 <a href="javascript:audio_bg.muted();">静音背景</a>
 5 <a href="javascript:audio_bg.volume_add();">增加背景音</a>
 6 <a href="javascript:audio_bg.volume_minus();">减少背景音</a>
 7 <br>
 8 <a href="javascript:audio_gift.play();">播放gift</a>
 9 <a href="javascript:audio_gift.pause();">暂停gift</a>
10 <a href="javascript:audio_gift.stop();">停止gift</a>
11 <a href="javascript:audio_gift.muted();">静音gift</a>
12 <a href="javascript:audio_gift.volume_add();">增加gift音</a>
13 <a href="javascript:audio_gift.volume_minus();">减少gift音</a>
14 <br>
15 <a href="javascript:audio_bomb.play();">播放bomb</a>
16 <a href="javascript:audio_bomb.pause();">暂停bomb</a>
17 <a href="javascript:audio_bomb.stop();">停止bomb</a>
18 <a href="javascript:audio_bomb.muted();">静音bomb</a>
19 <a href="javascript:audio_bomb.volume_add();">增加bomb音</a>
20 <a href="javascript:audio_bomb.volume_minus();">减少bomb音</a>

 

posted on 2016-11-30 14:11  马先洁  阅读(12239)  评论(1编辑  收藏  举报