请马老来控制雨

亚伦影音工作室

[i=s] 本帖最后由 亚伦影音工作室 于 2024-11-25 06:03 编辑 [/i]

红影

等着看如何解决的

夕阳黄昏

                               
登录/注册后可看大图

亚伦影音工作室

夕阳黄昏 发表于 2024-11-24 22:42

let raindrops=mnBox.queryselectorAII('.rain');
let rainpops=mnBox.queryselectorAII('.circle');
let rainstate=() =>{aud.paused ? (raindrops.forEach(drop=>{drop.style.animationpiaystate='paused'}),rainpops.forEach(pop=>{pop.style.animationpiaystate='paused'})): (raindrops.forEach(drop=>{ drop.style.animationpiaystate='yunning'}),rainpops.forEach(pop=>{pop.style.animationpiaystate='yunning'}));};

let mState = () =>{rainstate, aud.paused ? (player.style.setProperty('--sp1','1'), player.style.setProperty('--sp2','0')) : (player.style.setProperty('--sp1','0'), player.style.setProperty('--sp2','1'));};
aud.addEventListener('play', () => mState());
aud.addEventListener('pause', () => mState());
player.onclick = () => aud.paused ? aud.play(): aud.pause();

夕阳黄昏

亚伦影音工作室 发表于 2024-11-25 05:52
let raindrops=mnBox.queryselectorAII('.rain');
let rainpops=mnBox.queryselectorAII('.circle');
l ...

好像少了个括号

亚伦影音工作室

夕阳黄昏 发表于 2024-11-25 06:27
好像少了个括号

少在哪里？请指教！

夕阳黄昏

亚伦影音工作室 发表于 2024-11-25 07:42
少在哪里？请指教！

原帖的

1. <script >
   
2. function rain() {
   
3.         var str = "";
   
4.         for(i=0; i<50; i++) {
   
5.                 var l = Math.ceil(Math.random()*1200);
   
6.                 str += "<span class='rain' style='left:" + l +"px;'></span>";
   
7.         }
   
8.         for(j=0;j<40; j++){
   
9.                 var k1 = Math.ceil(Math.random()*100);
   
10.                 var k2 = Math.round(Math.random()*40+70);
    
11.                 str += "<span class='circle' style='left:" + k1 +"%;top:" + k2 +"%;'></span>";
    
12.         }
    
13.         document.getElementById('mnBox').innerHTML += str;
    
14. }
    
15. 
    
16. rain();
    
17. </script>
    
18. <script>
    
19. let mState = () => aud.paused ? (player.style.setProperty('--sp1','1'), player.style.setProperty('--sp2','0')) : (player.style.setProperty('--sp1','0'), player.style.setProperty('--sp2','1'));
    
20. aud.addEventListener('play', () => mState());
    
21. aud.addEventListener('pause', () => mState());
    
22. player.onclick = () => aud.paused ? aud.play(): aud.pause();
    
23. 
    
24. 
    
25. </script>

复制代码

修改为

1. <script >
   
2. function rain() {
   
3.         var str = "";
   
4.         for(i=0; i<50; i++) {
   
5.                 var l = Math.ceil(Math.random()*1200);
   
6.                 str += "<span class='rain' style='left:" + l +"px;'></span>";
   
7.         }
   
8.         for(j=0;j<40; j++){
   
9.                 var k1 = Math.ceil(Math.random()*100);
   
10.                 var k2 = Math.round(Math.random()*40+70);
    
11.                 str += "<span class='circle' style='left:" + k1 +"%;top:" + k2 +"%;'></span>";
    
12.         }
    
13.         document.getElementById('mnBox').innerHTML += str;
    
14. }
    
15. 
    
16. rain();
    
17. let raindrops = mnBox.querySelectorAll('.rain');
    
18. let rainpops = mnBox.querySelectorAll('.circle');
    
19. let rainState = () => {
    
20.         aud.paused ? (raindrops.forEach( drop => {drop.style.animationPlayState='paused'}) , rainpops.forEach( pop => {pop.style.animationPlayState='paused'}))
    
21.                                 : (raindrops.forEach( drop => {drop.style.animationPlayState='running'}) , rainpops.forEach( pop => {pop.style.animationPlayState='running'}));
    
22. }
    
23. let mState = () => {rainState(); aud.paused ? (player.style.setProperty('--sp1','1'), player.style.setProperty('--sp2','0')) : (player.style.setProperty('--sp1','0'), player.style.setProperty('--sp2','1'))};
    
24. aud.addEventListener('play', () => mState());
    
25. aud.addEventListener('pause', () => mState());
    
26. player.onclick = () => aud.paused ? aud.play(): aud.pause();
    
27. </script>

复制代码

亚伦影音工作室

夕阳黄昏 发表于 2024-11-25 08:09
原帖的

修改为

老师的控件好厉害，学习了！谢谢夕阳老师！