花飞飞 发表于 2026-1-14 16:16

【黑师代码】海的那边有什么（tzMaker在线制作工具试贴之一）

本帖最后由 花飞飞 于 2026-1-15 11:22 编辑 <br /><br /><style>
    @import 'https://638183.freep.cn/638183/web/tz/tz.v4.css';
    .pa { --offsetX: 81px; --bg: url('https://642303.freep.cn/642303/tu/20251229ydmbwb.webp') no-repeat center/cover; --ma-size: 6%; }
</style>

<div class="pa"></div>

<script type="module">
    import TZ from 'https://638183.freep.cn/638183/web/tz/tz.v3.js';

    const tz = TZ.TZ('pa');

    tz.add('audio', '', '', { src: 'https://music.163.com/song/media/outer/url?id=1294924084' });
    tz.add('video', '', 'qk-vid', {src: 'https://bpic.588ku.com/video_listen/588ku_video/25/02/26/10/22/30/video67be7ae60fbee.mp4'}).style('mix-blend-mode:screen;opacity: .59;');
    tz.add('img', '', 'ma', { src: 'https://642303.freep.cn/642303/za/0022.png' }).style('left: 50%; bottom: 60px; z-index: 1;').playmp3();
    tz.bgprog().style('left: 42%; bottom: 40px; color: green;');
    tz.fs().style('left: 20px; top: 20px;');
</script>

花飞飞 发表于 2026-1-14 16:20

@马黑黑 程序试用反馈。。
图片：之前完成的一个图，随意云的地址。
音频：网易随意找的，和平时找歌的方法一样
视频：有熊猫和千库区别，先试了一个熊猫，后来用了千库。不挡人脸。
根据实际情况，另外加了滤镜和透明度：mix-blend-mode:screen;opacity: .59;
小播：图片自己找的一个小图加上地址。尺寸默认12%改为6%；位置略改了一下下由45%改为50%
进度条：根据图片底色调整为绿色。
全屏按纽：没有变化。


花飞飞 发表于 2026-1-14 16:27

使用感受：元素添加都很顺手。。闭眼即可入手

头一次使用我的问题：
刚才贴子容器全部使用了默认，忘了更改偏移量，应根据提示这里要改为81PX。
图片原图大小为1800*1200，发出来后没有按原图大小显示，还要看看图片尺寸的调整。{:4_170:}{:4_173:}

杨帆 发表于 2026-1-14 16:36

问好花飞飞~效果一流，反馈及时，为马老师实现音画帖制作可视化点赞{:4_191:}

花飞飞 发表于 2026-1-14 16:49

杨帆 发表于 2026-1-14 16:36
问好花飞飞~效果一流，反馈及时，为马老师实现音画帖制作可视化点赞
这个的确是音画爱好者的福音

马黑黑 发表于 2026-1-14 20:40

offsetX 没改？

马黑黑 发表于 2026-1-14 20:41

花飞飞 发表于 2026-1-14 16:27
使用感受：元素添加都很顺手。。闭眼即可入手

头一次使用我的问题：


暂时自己在 .pa {} 里添加 width 和 height 属性

红影 发表于 2026-1-14 21:20

飞飞真是有心人，有如此详尽的使用情况反馈。
图图制作漂亮，欣赏飞飞好帖{:4_187:}

花飞飞 发表于 2026-1-15 11:22

马黑黑 发表于 2026-1-14 20:41
暂时自己在 .pa {} 里添加 width 和 height 属性

明白，加自然是会加的。
试贴之一主打一个原滋原味，啥也没加。{:4_170:}

花飞飞 发表于 2026-1-15 11:23

马黑黑 发表于 2026-1-14 20:40
offsetX 没改？

改过来了，就是一乐就忘了

花飞飞 发表于 2026-1-15 11:24

红影 发表于 2026-1-14 21:20
飞飞真是有心人，有如此详尽的使用情况反馈。
图图制作漂亮，欣赏飞飞好帖

问好影子，这个音画制作可视化太方便了

马黑黑 发表于 2026-1-15 12:08

花飞飞 发表于 2026-1-15 11:23
改过来了，就是一乐就忘了

{:4_172:}

马黑黑 发表于 2026-1-15 12:09

花飞飞 发表于 2026-1-15 11:22
明白，加自然是会加的。
试贴之一主打一个原滋原味，啥也没加。

{:4_199:}

花飞飞 发表于 2026-1-15 16:22

马黑黑 发表于 2026-1-15 12:09


有说明就更好用了。。刚看了一遍。。被笑的。。{:4_170:}

花飞飞 发表于 2026-1-15 16:22

马黑黑 发表于 2026-1-15 12:08


{:4_173:}要沉住气

马黑黑 发表于 2026-1-15 18:45

花飞飞 发表于 2026-1-15 16:22
有说明就更好用了。。刚看了一遍。。被笑的。。

咋地啦

马黑黑 发表于 2026-1-15 18:45

花飞飞 发表于 2026-1-15 16:22
要沉住气

应该的

红影 发表于 2026-1-16 09:20

花飞飞 发表于 2026-1-15 11:24
问好影子，这个音画制作可视化太方便了

是啊，可盐可甜，既可以完全使用默认，也可以按自己的喜欢添加东西，真的太方便了{:4_199:}

花飞飞 发表于 2026-1-16 16:07

马黑黑 发表于 2026-1-15 18:45
咋地啦

开心滴呀

花飞飞 发表于 2026-1-16 16:07

马黑黑 发表于 2026-1-15 18:45
应该的

{:5_117:}俗语叫淡定
页: [1] 2
查看完整版本: 【黑师代码】海的那边有什么（tzMaker在线制作工具试贴之一）