山歌寥哉·序曲

红影

马黑黑 发表于 2023-8-7 12:02
都说了，连边都沾不上，你还喊

好玩啊，你自己给自己起的名，肯定自己喜欢

红影

马黑黑 发表于 2023-8-7 12:03
--state 的变量赋值再JS文档中控制

这部分已经是上传好的吧？

马黑黑

红影 发表于 2023-8-7 16:46
这部分已经是上传好的吧？

控制按钮的关键帧动画里用到这个变量，但凡从宿主元素穿透到的，都从宿主元素操作该CSS变量

马黑黑

红影 发表于 2023-8-7 16:44
好玩啊，你自己给自己起的名，肯定自己喜欢

老黑是俺的诨名，黑黑是俺的诨号

马黑黑

花飞飞 发表于 2023-8-7 16:39
好用，前提是得会用

要深入展开，有事没事弄一遍，完了一切乱糟糟的，就重置

马黑黑

花飞飞 发表于 2023-8-7 16:28
好吧。。小白没听懂。。transform: scale(x)这一串怎么用。。
碰到实例再说吧。。

给个示例：一个 100 * 100 的元素，这是CSS和HTML代码——

<style>
#mybox {
    margin: 100px;
    width: 100px;
    height: 100px;
    background: pink;
    animation: sizer 2s infinite alternate linear;
}
@keyframes sizer {
    from { transform: scale(0.5); }
    to { transform: scale(1.5); }
}
</style>

<div id="mybox"></div>

animation 中，infinite 表示循环运行，alternate 表示反向运行，linear 表示线性速率（就是均匀变化）。

花飞飞

马黑黑 发表于 2023-8-7 17:40
要深入展开，有事没事弄一遍，完了一切乱糟糟的，就重置

正在适应中。。。坏习惯养成了难改。。

花飞飞

马黑黑 发表于 2023-8-7 17:51
给个示例：一个 100 * 100 的元素，这是CSS和HTML代码——

这个动画漂亮。。无限循环。。。
如果改成心形可以模拟心跳。。。
之前的画心师的心形是不是也是这样实现的。。。

花飞飞

马黑黑 发表于 2023-8-7 17:51
给个示例：一个 100 * 100 的元素，这是CSS和HTML代码——

看着代码很听话的样子，给指令就严格执行。。。
实例存起来了。。。

马黑黑

花飞飞 发表于 2023-8-7 20:14
看着代码很听话的样子，给指令就严格执行。。。
实例存起来了。。。

这个是简单的应用，你可以改造一下

马黑黑

花飞飞 发表于 2023-8-7 20:13
这个动画漂亮。。无限循环。。。
如果改成心形可以模拟心跳。。。
之前的画心师的心形是不是也是这样实 ...

当然，这个可以模拟心脏跳动，不过心脏跳动的模拟方式很多

马黑黑

花飞飞 发表于 2023-8-7 20:10
正在适应中。。。坏习惯养成了难改。。

以前设置IE吧，可能逻辑较为明显，毕竟IE能弄的功能也不多

小辣椒

哇塞，这个播放器我也是喜欢

马黑黑

小辣椒 发表于 2023-8-7 21:01
哇塞，这个播放器我也是喜欢

还没看见你不喜欢的

小辣椒

歌词倒影，一次都没有做过，作业都暂时欠一下了

小辣椒

马黑黑 发表于 2023-8-7 21:01
还没看见你不喜欢的

是的，统统喜欢，今天我发的大彩色球播放器太美的，许多播放器都只玩过一次，太可惜了

马黑黑

小辣椒 发表于 2023-8-7 21:15
是的，统统喜欢，今天我发的大彩色球播放器太美的，许多播放器都只玩过一次，太可惜了

不急的

马黑黑

小辣椒 发表于 2023-8-7 21:02
歌词倒影，一次都没有做过，作业都暂时欠一下了

倒影就一句代码，Chromium类型的浏览器有效

小辣椒

马黑黑 发表于 2023-8-7 21:55
倒影就一句代码，Chromium类型的浏览器有效

反正没有实践就感觉没有掌握一样，后面还是看看眼睛恢复情况了。。。

小辣椒

马黑黑 发表于 2023-8-7 21:54
不急的

不上来就不急，看见了就感觉拉下太多了