马黑黑 发表于 2026-2-22 17:15

辞岁行

<style>
    @import 'https://638183.freep.cn/638183/web/tz/tz2026.css';
    .pa { width: 1600px; --bg: url('https://yuanjineng.cn/webui/SDXL_styles/images/star/706.JPG') no-repeat center/cover; }
    .vid { width: 10vw; height: 10vw; border-radius: 50%; opacity: .8; cursor: pointer; }
</style>

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

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

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

    tz.add('audio', '', '', { src: 'https://music.163.com/song/media/outer/url?id=3349066330' });
    tz.add('video', '', 'pd-vid', { src: 'https://img.tukuppt.com/video_show/2414777/00/02/23/5b52ffe5b0de7.mp4' });
    tz.add('video', '', 'vid', {
          disablePictureInPicture: 'true',
          src: 'https://img.tukuppt.com/video_show/2475824/00/08/27/5d1c25a2656d6.mp4'
        }).playmp3();
    tz.bgprog().style('bottom: 30px; color: #fefefe; width: 240px;');
    tz.fs().style('right: 20px; top: 20px;');
    tz.autoMid();
</script>

马黑黑 发表于 2026-2-22 17:17

帖子代码
<style>
    @import 'https://638183.freep.cn/638183/web/tz/tz2026.css';
    .pa { width: 1600px; --bg: url('https://yuanjineng.cn/webui/SDXL_styles/images/star/706.JPG') no-repeat center/cover; }
    .vid { width: 10vw; height: 10vw; border-radius: 50%; opacity: .8; cursor: pointer; }
</style>

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

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

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

    tz.add('audio', '', '', { src: 'https://music.163.com/song/media/outer/url?id=3349066330' });
    tz.add('video', '', 'pd-vid', { src: 'https://img.tukuppt.com/video_show/2414777/00/02/23/5b52ffe5b0de7.mp4' });
    tz.add('video', '', 'vid', {
          disablePictureInPicture: 'true',
          src: 'https://img.tukuppt.com/video_show/2475824/00/08/27/5d1c25a2656d6.mp4'
        }).playmp3();
    tz.bgprog().style('bottom: 30px; color: #fefefe; width: 240px;');
    tz.fs().style('right: 20px; top: 20px;');
    tz.autoMid();
</script>

马黑黑 发表于 2026-2-22 17:27

本帖测试 tzMaker2026 模块，主要还是测试帖子在浏览器视口水平方向的自动居中功能。

居中速度应该相对较快，因为它不再等待，加载到帖子所在的DOM节点时立刻居中。自适应能力也有，浏览器改变窗口大小能跟随变化。对移动端显示设备的支持也拥有一定的支持度。

遗憾的是评分后帖子不能正常延续，这个问题目前没有办法解决。discuz论坛程序在评分后的局部刷新机制对 ES 模块的支持度有限，帖子的JS模块出现被重复加载、且施行加载的discuz子程序不认可帖子的JS模块，所以只能评分后手动刷新一下页面，或者离开再来，或者，如果有权限给帖子加精华，劳烦你操作一下，马上一切正常。

梦江南 发表于 2026-2-22 18:08

马黑黑 发表于 2026-2-22 17:27
本帖测试 tzMaker2026 模块，主要还是测试帖子在浏览器视口水平方向的自动居中功能。

居中速度应该相对 ...

黑黑老师，是的，开帖居中比较快，平分后就移到右边去了，重新刷一下就正常了。

红影 发表于 2026-2-22 19:41

马黑黑 发表于 2026-2-22 17:27
本帖测试 tzMaker2026 模块，主要还是测试帖子在浏览器视口水平方向的自动居中功能。

居中速度应该相对 ...

看到这句，赶紧加个精华看效果，发现貌似还是移动到右边了。

红影 发表于 2026-2-22 19:44

这图图很奇妙，音乐也好听。欣赏黑黑好帖{:4_187:}

马黑黑 发表于 2026-2-22 20:28

梦江南 发表于 2026-2-22 18:08
黑黑老师，是的，开帖居中比较快，平分后就移到右边去了，重新刷一下就正常了。

{:4_191:}

马黑黑 发表于 2026-2-22 20:29

红影 发表于 2026-2-22 19:41
看到这句，赶紧加个精华看效果，发现貌似还是移动到右边了。

那可能是你加精华的动作不对，得有左手

马黑黑 发表于 2026-2-22 20:29

红影 发表于 2026-2-22 19:44
这图图很奇妙，音乐也好听。欣赏黑黑好帖

感谢感谢

小辣椒 发表于 2026-2-22 20:38

黑黑辛苦，不断的修改 测试。。。。{:4_187:}

霜染枫丹 发表于 2026-2-22 20:55

马老师晚上好~~

很赞佩您这种精益求精，我不说假话，这一点是我的榜样。您用个人力量带动了论坛在制作上的提升，我觉得自己进步很大呢，{:4_173:}特别高兴。至于这个居中，我其他地方很好用，在这里我自己调几下也不觉得费神，关键是制作的东东是实在的。
谢谢马老师！祝新春快乐~~

https://www.yueyijyw.com/data/attachment/forum/202602/22/205436lfoj1jooz8nc33a5.gif

马黑黑 发表于 2026-2-22 21:02

霜染枫丹 发表于 2026-2-22 20:55
马老师晚上好~~

很赞佩您这种精益求精，我不说假话，这一点是我的榜样。您用个人力量带动了论坛在制作上 ...

{:4_180:}

马黑黑 发表于 2026-2-22 21:03

小辣椒 发表于 2026-2-22 20:38
黑黑辛苦，不断的修改 测试。。。。

这时居家办公的好处：有的是时间（就是没钱交电费）{:4_173:}

小辣椒 发表于 2026-2-22 21:12

马黑黑 发表于 2026-2-22 21:03
这时居家办公的好处：有的是时间（就是没钱交电费）

电费我们这里晚上用电特别便宜，白天好像贵一点，反正按全年计数，我们因为空调用的多，会超出，还有地暖用了也是肯定大超

樵歌 发表于 2026-2-22 21:15

中间那播放器妥妥的居中好看！{:4_176:}

马黑黑 发表于 2026-2-22 21:51

樵歌 发表于 2026-2-22 21:15
中间那播放器妥妥的居中好看！

是的吧？好看多看

马黑黑 发表于 2026-2-22 21:51

小辣椒 发表于 2026-2-22 21:12
电费我们这里晚上用电特别便宜，白天好像贵一点，反正按全年计数，我们因为空调用的多，会超出，还有地暖 ...

电费贵点没啥问题，关键是有钱钱缴费就好

红影 发表于 2026-2-22 22:14

马黑黑 发表于 2026-2-22 20:29
那可能是你加精华的动作不对，得有左手

哈哈，这个还分左右手啊，要求真高{:4_173:}

红影 发表于 2026-2-22 22:18

马黑黑 发表于 2026-2-22 20:29
感谢感谢

阔气阔气了{:4_187:}

马黑黑 发表于 2026-2-22 23:29

红影 发表于 2026-2-22 22:18
阔气阔气了

{:4_190:}
页: [1] 2
查看完整版本: 辞岁行