朵拉 发表于 2026-2-21 22:39

烟花易冷（学习马黑黑生命流效果）

<style>
    @import 'https://638183.freep.cn/638183/web/tz/tz.v5.css';
    .pa { --bg: url('https://pic1.imgdb.cn/item/6999beefd908540f9e202212.jpg') no-repeat center/cover; }
    .vid { width: 80px; height: 80px; mix-blend-mode: screen; border-radius: 50%; bottom: 60px; filter: drop-shadow(-2px -2px 16px green); cursor: pointer; }
</style>

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

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

    const tz = TZ.TZ('pa');
    var lrcAr = [
    ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
    tz.lrc(lrcAr).style('top: 20px; right: 50px');
    tz.add('audio', '', '', {src: 'http://cccimg.com/view.php/8d8e54e5a771e07e4c53398a27ffb95e.mp3'});
    tz.add('video', '', 'pd-vid', {src: 'https://img.tukuppt.com/video_show/2418175/01/29/76/62a7571a73dc2.mp4'});
    tz.add('video', '', 'vid', {
            src: 'https://img.tukuppt.com/video_show/2421007/00/08/36/5d1ede4eb6ac5.mp4',
            disablePictureInPicture: true
    }).playmp3();
    tz.bgprog().style('bottom: 40px; color: #fefefe; width: 240px;');
    tz.fs().style('right: 20px; top: 20px;');
    tz.autoMid();
</script>

朵拉 发表于 2026-2-21 22:41

@马黑黑
老师好 新年快乐，学生交作业，请指正{:4_190:}

马黑黑 发表于 2026-2-21 23:04

既然歌词靠右，那么，全屏按钮应放在别的地方，例如左边。把全屏按钮的 right 改为 left 即可

红影 发表于 2026-2-22 08:27

制作漂亮，歌曲好听。欣赏朵宝好帖{:4_204:}

梦油 发表于 2026-2-22 10:57

画面上的水珠很有艺术感。
页: [1]
查看完整版本: 烟花易冷（学习马黑黑生命流效果）