战争艺术

马黑黑 · 发表于 2024-10-30 12:09

红影发表于 2024-10-30 09:51
这个路径图案也有趣，心形的，怪不得残酷的战争也能被叫做艺术，双方明明是同归于尽的感觉

这就是战争。战争残酷，战争也有温情。

马黑黑 · 发表于 2024-10-30 12:10

花飞飞发表于 2024-10-30 10:20
战斗民族骨子里的战斗基因觉醒。。。
看到这标题就想，东风不知道准备好了木有呀。。
来个伏尸 ...

人不犯我，东风不犯人；人若犯我，东风必犯人。

马黑黑 · 发表于 2024-10-30 12:20

花飞飞发表于 2024-10-30 10:23
这个圆片片有了背景衬托闪亮效果更好。。。看代码小球有阴影，触碰可变大一些。。。
所有小球都可以控制动 ...

这就是class，类属性，对应CSS的 .ball 选择器，凡 class="ball" 的元素，都纳入 class 属性指向的类。

本例，没有使用 var balls = document.querySelectorAll('.ball') 去获取操作标识符，而是利用动画绘制 svg 小球时将元素加入了事先声明的数组变量 balls（声明在20行，balls = []，加入在28行，balls.push(dr.elm)，其中dr.elm 指的是 svgdr 返回的当前元素）。

用 querySelectorAll 方法获得的元素集群也是一个数组，所以上述方法也是可行的。

然后在30行对 balls 进行编程，balls 分解为每一个 b，b点击事件（b.onclick）触发花括号里面的语句的执行，其中 31 行的设置小球播放与否、32行控制音频播放或暂停。

小球变大的设置则由CSS完成，代码在第5行。

愤怒的葡萄 · 发表于 2024-10-30 15:19

马黑黑发表于 2024-10-30 12:08
中午好

今天下午三点多才上线的，感觉有点累的，年龄大了，体力明显不支。

花飞飞 · 发表于 2024-10-30 19:44

马黑黑发表于 2024-10-30 12:10
人不犯我，东风不犯人；人若犯我，东风必犯人。

不惹事儿也不怕事儿的节奏。。。这个好。。就是个儒雅的霹雳金刚
突然发现这个贴子画面有点相爱相杀的感觉。。

花飞飞 · 发表于 2024-10-30 20:05

马黑黑发表于 2024-10-30 12:20
这就是class，类属性，对应CSS的 .ball 选择器，凡 class="ball" 的元素，都纳入 class 属性指向的类。
...

当时看到这个（b.onclick）就觉得不太一样。。
原来是把balls分解了，而且每个小球都拥用balls声明的属性。。
先进行集群式的统一声明添加，再分解给到每个小元素，思路真是赞赞的。。。
妙晕了。。

花飞飞 · 发表于 2024-10-30 20:16

马黑黑发表于 2024-10-30 07:45
34行代码：

aud.play() 是播放音频指令。audio控件的播放会返回一个 promise，当不能返回正常值时一般的 ...

catch 去捕捉到错误，然后令所有动画停止。这是特殊情况下的，比如音乐链接失效了。
之前的非SVG的贴子是不是也适用。。

还有这个机制，是不是对视频动态无效，毕竟视频不是用--state 变量控制的

catch机制需要audio标签配套，不要 autoplay 属性，第十行autoplay这个是不是可以去掉呢。