朵拉 发表于 2026-3-18 22:41

给未来的自己(学习马黑黑至此流年效果)

<style>
@import 'https://638183.freep.cn/638183/tzmaker/tz5.css';
.pa { --bg: url('https://upfile.mp3.wf/view.php/19d4ef7b31b0be2cdf7e326003356c08.jpg') no-repeat center/cover; --ma-size: 120px; }
.fadeInLrc { left: 50px; top: 30px; writing-mode: vertical-rl; text-orientation: upright; z-index: 105; }
.char { padding: 4px; }
#msvg { bottom: 20px; }
</style>


<div class="pa">
<svg id="msvg" width="200" height="200">
    <g>
      <title>调节进度</title>
      <path id="track" d="M10 100 A1 1 0 0 0 190 100" fill="none" stroke="lightblue" stroke-width="8" />
      <path id="prog" d="M10 100 A1 1 0 0 0 190 100" fill="none" stroke="lightgreen" stroke-width="8" />
    </g>
</svg>
</div>

<script>
var jsFile = 'https://638183.freep.cn/638183/tzmaker/tz5.js';
loadJs(jsFile, tzInit);

var gc = `给未来的自己\n制作: 朵拉\n\n站在狂风的天台一望无际\n这一座孤独的城市\n在天空与高楼交界的尽头\n谁追寻空旷的自由\n阳光覆满这一刻宁静的我隔绝了喧嚣和冷漠\n川流不息的人游荡在街头\n谁能听见谁的寂寞\n找一个人惺惺相惜\n找一颗心心心相印\n在这个宇宙我是独一无二\n没人能取代\n不管怎样 怎样都会受伤\n伤了又怎样\n至少我很坚强我很坦荡\n夜幕笼罩灿烂的一片灯海\n多少人多少种无奈\n在星光里遗忘昨天的伤害\n一教醒来还有期待\n我不放弃爱的勇气\n我不怀疑会有真心\n我要握住一个最美的梦\n给未来的自己\n一天一天 一天推翻一天\n坚持的信仰\n我会记住自己今天的模样\n有一个人惺惺相惜\n有一颗心心心相印\n抛开过去我想认真去追寻\n未来的自己\n不管怎样 怎样都会受伤\n伤了又怎样\n至少我很坚强我很坦荡\n我不放弃爱的勇气\n我不怀疑会有真心\n我要握住一个最美的梦\n给未来的自己\n不管怎样 怎样都会受伤\n伤了又怎样\n至少我很坚强我很坦荡\n未来的你会懂我的疯狂`;

function loadJs(url, callback) {
    const script = document.createElement('script');
    script.charset = 'utf-8';
    script.src = url;
    script.defer = true;
    script.onload = callback;
    document.body.appendChild(script);
}

function tzInit() {
    var tz = TZ('pa');
    tz.add('audio', '', '', {src: 'https://upfile.mp3.wf/view.php/58e5de3adc6cf64aa6257ff6d4873f69.mp3'});
    tz.add('video', '', 'pd-vid', {src: 'https://img.tukuppt.com/video_show/2629112/00/01/92/5b4d9113bffd1.mp4'});
    tz.add('img', '', 'ma', { src: 'https://upfile.mp3.wf/view.php/5982cec672785f97b7b61daf4c0e0885.webp' }).style('bottom: 50px;').playmp3();
    tz.svgprog('msvg', 'track', 'prog');
    tz.lrc(tz.lrc2HC(gc), '', true);//.style('top: 30px;');
    tz.fs().style('right: 20px; top: 20px;');
    tz.autoMid();
}
</script>

朵拉 发表于 2026-3-18 22:42

@马黑黑
老师 晚上好,学生交作业,请您指正{:4_190:}

梦油 发表于 2026-3-19 10:55

欣赏佳作,问候朵拉。

红影 发表于 2026-3-19 13:53

漂亮,欣赏朵宝好帖{:4_187:}

马黑黑 发表于 2026-3-19 19:59

{:4_199:}
页: [1]
查看完整版本: 给未来的自己(学习马黑黑至此流年效果)