凤山舞曲（10'47''）

马黑黑 · 发表于 2024-4-15 12:15

请马上登录，朋友们都在花潮里等着你哦：）

您需要登录才可以下载或查看，没有账号？立即注册

x

本帖最后由马黑黑于 2024-4-15 12:18 编辑

马黑黑 · 发表于 2024-4-15 12:19

帖子代码

<style>

#papa { margin: 0 0 0 calc(50% - 581px); width: 1000px; height: 666px; background: url('https://638183.freep.cn/638183/t24/webp/fguj.webp') no-repeat center/cover; z-index: 1; position: relative; }

#play { position: absolute; width: 100px; left: calc(50% - 50px); top: 20px; opacity: .7; cursor: pointer; animation: rot 5s linear infinite var(--state); }

@keyframes rot { to { transform: rotate(360deg); } }

</style>

</div>

var sF = document.createElement('script');

sF.charset = 'utf-8';

sF.src = 'https://638183.freep.cn/638183/web/js/ball-lz.js';

document.body.appendChild(sF);

var lz = {papa: '#papa', total: 30, maxsize: 25, move: false};

var mState = () => {

lz.move = !aud.paused;

papa.style.setProperty('--state', ['paused','running'][+lz.move]);

}

play.onclick = () => {

aud.paused ? aud.play() : aud.pause();

mState();

}

window.onload = () => mState();

</script>

马黑黑 · 发表于 2024-4-15 12:24

粒子配置：18行

papa - 帖子容器标识，为 id 时带 # 号，为 class 时带 . 号，例如：papa: '.mydiv',

total - 小球总数

maxsize - 小球最大直径

move - 小球是否可以移动。这个随意配置为 true 或 false，其值会依据音频的播放暂停状态变更

另外，帖子的音频控制尝试使用新的机制，测试中

马黑黑 · 发表于 2024-4-15 12:25

最大直径应设置合理的数值，一般在10 ~ 50 之间较好

马黑黑 · 发表于 2024-4-15 12:37

友情提示：

小球接受点击操作，当小球任何情况下被点击，会在一定区间内来回改变大小（每次加/减2像素）并变色。

朵拉 · 发表于 2024-4-15 15:31

首席欣赏，学习下

梦油 · 发表于 2024-4-15 16:33

听到舞曲脚下也在跃跃欲试。

流水光阴 · 发表于 2024-4-15 16:40

凤山舞曲（10'47''）这个标题很新奇

南无月 · 发表于 2024-4-15 17:56

粒子碰撞的给封装起来了，用起来更加方便。。

马黑黑 · 发表于 2024-4-15 18:01

南无月发表于 2024-4-15 17:56
粒子碰撞的给封装起来了，用起来更加方便。。

这个封装仅仅是粒子，不包含音频联动控制。音频控制需要在自己的帖子中处理，或有第三方插件处理也行

马黑黑 · 发表于 2024-4-15 18:01

流水光阴发表于 2024-4-15 16:40
凤山舞曲（10'47''）这个标题很新奇

凤山是个地名

马黑黑 · 发表于 2024-4-15 18:02

梦油发表于 2024-4-15 16:33
听到舞曲脚下也在跃跃欲试。

科目三的上？

马黑黑 · 发表于 2024-4-15 18:02

朵拉发表于 2024-4-15 15:31
首席欣赏，学习下

绿叶清舟 · 发表于 2024-4-15 18:32

马黑黑发表于 2024-4-15 12:37
友情提示：

小球接受点击操作，当小球任何情况下被点击，会在一定区间内来回改变大小（每次加/减2像素） ...

想要抓到还真是不太容易了

马黑黑 · 发表于 2024-4-15 18:44

绿叶清舟发表于 2024-4-15 18:32
想要抓到还真是不太容易了

你可以暂停播放

绿叶清舟 · 发表于 2024-4-15 18:52

马黑黑发表于 2024-4-15 18:44
你可以暂停播放

不早说，害俺抓了老半天的，以为暂停这也跟着不见了呢

马黑黑 · 发表于 2024-4-15 19:37

绿叶清舟发表于 2024-4-15 18:52
不早说，害俺抓了老半天的，以为暂停这也跟着不见了呢

音画帖主打播放控制，一切联动由音频而来

绿叶清舟 · 发表于 2024-4-15 20:01

马黑黑发表于 2024-4-15 19:37
音画帖主打播放控制，一切联动由音频而来

以为点击必须动态时才有效果的，没想到可以停下来任由着点了，太欺负点了

南无月 · 发表于 2024-4-15 20:26

马黑黑发表于 2024-4-15 18:01
这个封装仅仅是粒子，不包含音频联动控制。音频控制需要在自己的帖子中处理，或有第三方插件处理也行

好，突然想到一个重要的事。。
音乐。。
做图要安静，就关了音乐。

马黑黑 · 发表于 2024-4-15 20:45

南无月发表于 2024-4-15 20:26
好，突然想到一个重要的事。。
音乐。。
做图要安静，就关了音乐。

[音乐心情] 凤山舞曲（10'47''）

请马上登录，朋友们都在花潮里等着你哦：）

评分

帖子代码

花潮帅哥

鼠

牛

虎

兔

龙

蛇

马

羊

猴

鸡

狗

猪

多彩人生

星月交辉

奔放热烈

海样胸怀

春风拂面

火热情怀

优雅迷人

神秘浪漫

相遇之美

鹰傲苍穹

花好月圆

紫色情节

飞龙在天

王者至尊

大将风范

音画大师

天籁妙音

共看流星

风雨同行

我心永远

幸福快乐

喜乐安康

侠骨柔肠

心想事成

开朗大方

花潮管理

花潮美女

七彩绚丽

心香一瓣

妙笔生花

天长地久

花潮贵宾

缤纷心情

心曲飞扬

前途似锦

蝴蝶情怀

绚丽缤纷

指尖上的流年

花潮版主