时间机器

马黑黑

花飞飞 发表于 2024-11-19 18:59
矮油，我还看到了升级版。。
这个跟我站里的一样。没有线型进度条。。。。

线条可控进度条开发中，晚饭后弄好了，还木有更新网盘模块。另外，要使用进度条，需要帖子配合

马黑黑

花飞飞 发表于 2024-11-19 19:08
这个音频管理视频，各种动画，这个控制也封起来了，用起来岂不是更简单。。。
天哪，以后就不用管JS控制 ...

这个才开始做，预设 CSS+HTML 部分由帖子提供，需要向模块提供至少 ①帖子父元素id，②帖子audio id，③ 由CSS变量控制运动的音频控制按钮id，④ 控制CSS动画的CSS变量（例如 --state)，可选的有 ⑥ 进度条id

进度条预设是酱紫：用一个有背景色的线状div标签做进度条，它的一个伪元素用来模拟进度滑块，另一个伪元素负责显示音频时间信息。滑块不可拖动（因为编程消耗偏大），整个进度条通过点击改变播放时间。

马黑黑

花飞飞 发表于 2024-11-19 19:11
让做贴子变得更简单。。。
白老师你真是音画爱好者的大福星。。

谢谢喜欢

红影

这个太美了，背景只用一个小图，加上视频填充。小播有旋转还有虚线偏移，看着特别绚丽

红影

小播和背景小图的配合特别奇妙。
这个帖子最厉害的是还设计了音频管理的联动封装，这个太好了，让svg动画以及视频那么方便地被一键全控，这个真方便

马黑黑

红影 发表于 2024-11-19 19:56
小播和背景小图的配合特别奇妙。
这个帖子最厉害的是还设计了音频管理的联动封装，这个太好了，让svg动画 ...

这个是刚做的，测试中，等下在俺的院子里放一个更新版

马黑黑

红影 发表于 2024-11-19 19:53
这个太美了，背景只用一个小图，加上视频填充。小播有旋转还有虚线偏移，看着特别绚丽

花飞飞

马黑黑 发表于 2024-11-19 19:23
里程碑？有这么严重吗

理程碑，有理的理。。
必须的，这个不用思考动态控制大大的解救了小白~~

花飞飞

马黑黑 发表于 2024-11-19 19:24
这个设计得分吧

创意和设计必须得满分。。
每天看白老师的贴子就是看惊喜。。
第一次用这样的小背景，center/ 400px 400px;控制到想要的尺寸~~这个是真的学到了

花飞飞

马黑黑 发表于 2024-11-19 19:25
线条可控进度条开发中，晚饭后弄好了，还木有更新网盘模块。另外，要使用进度条，需要帖子配合

你好速度的。。刚看到第三版更新
加了两个伪元素，一个是圆形进度点，一个是两端的时间。
content: attr(data-tt);这个新的吧，面生得很

花飞飞

马黑黑 发表于 2024-11-19 19:34
这个才开始做，预设 CSS+HTML 部分由帖子提供，需要向模块提供至少 ①帖子父元素id，②帖子audio id，③  ...

这楼有构思，我看到成品了。。
需要提供的这几项反正比之前JS简单多了，哈哈。。
①帖子父元素id，（都得有）
②帖子audio id，（自己编一个，一般是抄白老师的）
③ 由CSS变量控制运动的音频控制按钮id，（这个只要有小播就有）
④ 控制CSS动画的CSS变量（例如 --state)，（你贴子里还说用--run也行的）

可选的有⑥ 进度条id
好吧，原来进度条是可选的。。其实给个进度条也不错，怪好看的。。

花飞飞

马黑黑 发表于 2024-11-19 19:35
谢谢喜欢

谢谢喜欢，上杯茶

绿叶清舟

时光机器啊，酷了

马黑黑

绿叶清舟 发表于 2024-11-19 20:37
时光机器啊，酷了

马黑黑

花飞飞 发表于 2024-11-19 20:27
谢谢喜欢，上杯茶

谢茶

马黑黑

花飞飞 发表于 2024-11-19 20:21
你好速度的。。刚看到第三版更新
加了两个伪元素，一个是圆形进度点，一个是两端的时间。
con ...

这个之前经常用到的

马黑黑

花飞飞 发表于 2024-11-19 20:17
创意和设计必须得满分。。
每天看白老师的贴子就是看惊喜。。
第一次用这样的小背景，center/ 400px 40 ...

大大小小都可用

马黑黑

花飞飞 发表于 2024-11-19 20:14
理程碑，有理的理。。
必须的，这个不用思考动态控制大大的解救了小白~~

CSS代码会偏多

花飞飞

马黑黑 发表于 2024-11-19 20:43
CSS代码会偏多

只要不是JS，别的都好说

花飞飞

马黑黑 发表于 2024-11-19 20:43
大大小小都可用

适合的就是最好的。