卡门-葛兰（学习黑黑Josh Vietti : Toccata代码）

梦油

红影 发表于 2025-8-10 23:02
这首歌挺有趣的

你选的曲子很棒！

红影

马黑黑 发表于 2025-8-11 00:02
小播的设计很漂亮

不知我为什么，点击后动图不见了。

红影

杨帆 发表于 2025-8-11 13:34
好像动图大小不可控？

是啊，动图只能暂停，不变化大小。

红影

梦油 发表于 2025-8-11 14:15
你选的曲子很棒！

偶尔听到，觉得很有意思

马黑黑

红影 发表于 2025-8-11 17:12
不知我为什么，点击后动图不见了。

是的，不稳定，一切看打开页面是页面的加载情况。对应语句需要像下面这么改，然后刷新，就一切OK了：

window.onload = () => ctx.drawImage(pic, 0, 0, 365, 280);

红色部分是添加上的代码，其意是浏览器对页面加载完毕后执行 => 后面的内容。

花飞飞

红影 发表于 2025-8-10 23:08
谢谢飞飞，飞飞看得真仔细，把一些调整都提了呢，看到你的回复开心，有种特别希望你看到的感觉

影子作品是真的 很棒。。代码条理清晰，非常棒。。

花飞飞

红影 发表于 2025-8-10 23:10
黑黑的qk-  和  pd- 在封装里都有，这样真方便，想用不同大小的视频也可以选两个地方的来弄了呢

对的，这两种特别常用，封进去就更方便了

寒冬残荷

点赞！欣赏！太美了！歌曲好玩

红影

马黑黑 发表于 2025-8-11 18:29
是的，不稳定，一切看打开页面是页面的加载情况。对应语句需要像下面这么改，然后刷新，就一切OK了：

...

改好了，果然现在点上去不会没有了，谢谢黑黑

红影

花飞飞 发表于 2025-8-11 19:42
影子作品是真的 很棒。。代码条理清晰，非常棒。。

好像视频有一个没弄好，logo露出来了

红影

花飞飞 发表于 2025-8-11 19:43
对的，这两种特别常用，封进去就更方便了

对的，黑黑的封装考虑得特别细致，跟着用的人有福了

红影

寒冬残荷 发表于 2025-8-12 20:41
点赞！欣赏！太美了！歌曲好玩

多谢鼓励，嗯嗯，这个歌曲有种违背世俗的感觉

小辣椒

亲爱的好制作，画面感特别好

小辣椒

看看好像很难的，都不会做了

马黑黑

红影 发表于 2025-8-12 22:22
改好了，果然现在点上去不会没有了，谢谢黑黑

我刚做的时候最先用 img 的 onload 事件，它处理起来比 window.onload 复杂一点：要考虑图片是否已经加载完成，若是，直接绘制，若不是，就借用图片标签的 onload 事件来绘制。window.onload 就不用判断什么。

马黑黑

小辣椒 发表于 2025-8-12 22:27
看看好像很难的，都不会做了

应该不难的，好像是很简单

红影

小辣椒 发表于 2025-8-12 22:27
亲爱的好制作，画面感特别好

谢谢亲爱的，听着这歌曲好玩，就用来做个帖子

红影

小辣椒 发表于 2025-8-12 22:27
看看好像很难的，都不会做了

不难的，里面很多都是黑黑封装好的啊。

红影

马黑黑 发表于 2025-8-12 22:34
我刚做的时候最先用 img 的 onload 事件，它处理起来比 window.onload 复杂一点：要考虑图片是否已经加载 ...

我也不懂两者的区别，就按你让我改的方式改上去了

马黑黑

红影 发表于 2025-8-12 22:54
我也不懂两者的区别，就按你让我改的方式改上去了

window基于整个浏览器页面，页面加载完了，图片肯定也加载完毕，这时候将图片绘制到画布上图片源的问题就木有了，可以随意画了。

用图片加载事件也行，就是会多处两三行代码