鱼儿吐个泡泡

红影

马黑黑 发表于 2023-7-2 20:19
差远了

这个太谦虚了吧。

马黑黑

红影 发表于 2023-7-2 21:07
这个太谦虚了吧。

必须的

红影

马黑黑 发表于 2023-7-2 22:16
必须的

我发现这会又把体育老师拉出来了，体育老师真累。

马黑黑

红影 发表于 2023-7-2 22:24
我发现这会又把体育老师拉出来了，体育老师真累。

应该的

红影

马黑黑 发表于 2023-7-2 22:25
应该的

体育老师都是被你害的。

马黑黑

红影 发表于 2023-7-2 22:31
体育老师都是被你害的。

和我木有关系呀，这是现实问题

南无月

鱼儿 发表于 2023-7-2 17:58
都这个时候了，估计今天没戏了

啊啊啊哈哈，尖叫一下，刚发现真的出了六集……

鱼儿

南无月 发表于 2023-7-2 23:12
啊啊啊哈哈，尖叫一下，刚发现真的出了六集……

我刚说完两分钟，就定档播出了

南无月

马黑黑 发表于 2023-7-2 13:12
会懂得的

等懂等懂等等懂

南无月

马黑黑 发表于 2023-7-2 13:13
@keyframes 定义的动画带名字，哪个元素用它，带上正确的名字就行

昨天做海底那个贴子，粒子里一个MOVE，还有一个也有一个MOVE，两个打架了，就把其中一对改成MOVE1，居然解决 了。。。

马黑黑

南无月 发表于 2023-7-3 08:48
昨天做海底那个贴子，粒子里一个MOVE，还有一个也有一个MOVE，两个打架了，就把其中一对改成MOVE1，居然 ...

名字不能雷同的。班里有两个小黑黑，得给他们加前缀或后缀，直接给他们改名当然也可以。

南无月

马黑黑 发表于 2023-7-2 13:13
完全可以

翻了记录才知道是调整线性渐变的角度，这个有机会得试试

马黑黑

南无月 发表于 2023-7-3 08:46
等懂等懂等等懂

南无月

鱼儿 发表于 2023-7-3 00:14
我刚说完两分钟，就定档播出了

后面才知道是六点的事儿。。。这几家视频在出牌，看谁压得过谁。。。。你空降，我也降。。

南无月

鱼儿 发表于 2023-7-3 00:14
我刚说完两分钟，就定档播出了

我昨晚回来太迟，没忍住看了一集。。等会去补。。
你是不是又看完四集才睡
好象近期新剧很多，看不过来了。。我补闪耀的她还没补完，长风渡也只看了一半多。。。。。

南无月

马黑黑 发表于 2023-7-3 08:50
名字不能雷同的。班里有两个小黑黑，得给他们加前缀或后缀，直接给他们改名当然也可以。

试了相同的动态就不正常了，它们乱认。。
以后知道了，碰到有需要的就直接改名。。。。

红影

马黑黑 发表于 2023-7-1 19:20
代码

--deg: 30deg; --xx: -200px;
这个设置没看懂。
在JS里--deg: ${50 - Math.ceil(Math.random() * 100)}deg; 也就是50到-50里变化的吧，开始设置的--deg: 30deg; 派什么用途？
--xx: -${300 + Math.ceil(Math.random() * 600)}px;貌似从-330到-900里变化的，那开始的-200是做什么的？而且bottom: 80px;哦，这个好像没什么关联，那个--xx是指后面移动的量。

红影

其实是想试试让那条鱼儿转45度，鱼儿好转，然后粒子不知道怎么转了，貌似x和角度也必须跟着转，乱试了一下，弄成这样：

红影

1. <style>
   
2. #mydiv {
   
3.         margin: 0 0 0 calc(50% - 593px);
   
4.         width: 1024px;
   
5.         height: 600px;
   
6.         background: linear-gradient(to right top, rgba(100,0,0,.65), rgba(0,0,0,.7));
   
7.         overflow: hidden;
   
8.         position: relative;
   
9.         --state: paused;
   
10. }
    
11. #mplayer {
    
12.         position: absolute;
    
13.         left: 30%;
    
14.         bottom: 2px;
    
15.         transform: translate(-40%) rotate(135deg);
    
16.         font: normal 80px / 80px sans-serif;
    
17.         cursor: pointer;
    
18.         z-index: 999;
    
19. }
    
20. li-zi {
    
21.         display: block;
    
22.         position: absolute;
    
23.         left: 35%;
    
24.         bottom: 80px;
    
25.         width: 20px;
    
26.         height: 20px;
    
27.         background: snow;
    
28.         border-radius: 50%;
    
29.         animation: move 10s var(--delay) infinite ease-out var(--state);
    
30.         --deg: 30deg; --xx: -200px; --yy: 100px; --delay: 0;
    
31. }
    
32. @keyframes move {
    
33.         from { transform: rotate(0deg) translateY(0px) translateX(0px); opacity: 1; }
    
34.         to { transform: rotate(var(--deg)) translateY(var(--xx)) translateX(var(--yy)); opacity: 0; }
    
35. }
    
36. </style>
    
37. 
    
38. <div id="mydiv">
    
39.         <div id="mplayer">&#128031;</div>
    
40. </div>
    
41. <audio id="aud" src="http://www.kumeiwp.com/sub/filestores/2022/03/21/643a94bf79472c834963eb68ee8a42ed.mp3" autoplay="autoplay" loop="loop"></audio>
    
42. 
    
43. <script>
    
44. 
    
45. (function (){
    
46.         let total = 30;
    
47.         let createLizi = (mum,sons) => {
    
48.                 Array.from({length: sons}).forEach( (s,k) => {
    
49.                         let xx = 6 + Math.ceil(Math.random() * 20);
    
50.                         s = document.createElement('li-zi');
    
51.                         s.style.cssText += `
    
52.                                 width: ${xx}px;
    
53.                                 height: ${xx}px;
    
54.                                 left: calc(35% - ${xx / 2}px);
    
55.                                 --deg: ${95 - Math.ceil(Math.random() * 100)}deg;
    
56.                                 --xx: -${300 + Math.ceil(Math.random() * 600)}px;
    
57.                                 --yy: ${150 + Math.ceil(Math.random() * 300)}px;
    
58.                                 --delay: -${Math.random() * 9}s;
    
59.                         `;
    
60.                         mum.appendChild(s);
    
61.                 });
    
62.         };
    
63.         createLizi(mydiv,total);
    
64.         let mState = () => aud.paused ? (mydiv.style.setProperty('--state','paused'),canMove = false) : (mydiv.style.setProperty('--state','running'),canMove = true);
    
65.         aud.addEventListener('play', mState, false);
    
66.         aud.addEventListener('pause', mState, false);
    
67.         mplayer.onclick = () => aud.paused ? aud.play() : aud.pause();
    
68. })();
    
69. 
    
70. </script>
    

复制代码

红影

🐟