论坛 › AI创作交流 › 相遇.缘分

霜染枫丹 发表于 2026-5-14 21:00

相遇.缘分

本帖最后由 霜染枫丹 于 2026-5-14 21:11 编辑

相遇

多年前与你不期而遇
追梦的季节
从此开门鲜花也飘洒雨滴
多年后仍难忘记
彷徨的少年期盼重逢
又怕等待与别离等待与别离
等待与别离
啊......啊大漠起落
你在光阴间吟唱浪漫传奇
曲终人散
有一份温暖始终珍藏心底，
多年前与你惊鸿一隅、遇
逐梦的年华
从此吹满星光也洒落诗意
多年后仍常念起
青涩的模样渴望相见，
又惧岁月与疏离
岁月与疏离
啊......时光流转
你在回忆里演绎温柔序曲
聚散有时
有一缕牵挂始终萦绕
心底

霜染枫丹 发表于 2026-5-14 21:10

<style>
    @import 'https://638183.freep.cn/638183/web/tz/tz.v4.css';

    .pa {
      --offsetX: 80px;
      --bg: url('https://ff.xiaoqiaodali.top:5401/i/2026/05/14/6a05b6834614d.gif') no-repeat center/cover;
      --ma-size: 8%;
      width: 1300px;
      height: 731px;
      position: relative;
      overflow: hidden;
    }

    .pa *, .pa *::before, .pa *::after {
      content: none !important;
    }

    #custom-lrc-container {
      position: absolute;
      top: -30px;
      left: -110px;   
      display: flex;
      justify-content: center;
      align-items: center;   
      width: 400px;      
      height: 400px;      
      z-index: 9999;
      pointer-events: none;
      overflow: visible;
    }

    .lrc-line {
      writing-mode: vertical-rl;   
      text-orientation: upright;   
      white-space: pre;
      font-size: 34px;
      font-weight: bold;
      text-shadow: 0 0 15px rgba(0,0,0,0.9);
      opacity: 0;
      transform: scale(0.9) translateY(20px);
      animation: lrcFadeIn 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
      position: relative;
      flex-shrink: 0;
    }

    @keyframes lrcFadeIn {
      to {
            opacity: 1;
            transform: scale(1) translateY(0);
            text-shadow: 0 0 25px rgba(255, 215, 0, 0.5), 0 0 10px rgba(255,255,255,0.3);
      }
    }

    .char-color {
      display: inline-block;
      animation: charGlow 0.8s forwards;
    }

    @keyframes charGlow {
      to {
            text-shadow: 0 0 10px currentColor;
      }
    }
</style>

<div class="pa">
    <div id="custom-lrc-container"></div>
</div>

<script type="module">
    import TZ from 'https://638183.freep.cn/638183/web/tz/tz.v4.js';
    const tz = TZ.TZ('pa');

    tz.add('audio', '', '', { src: 'http://cccimg.com/view.php/81a084f15aedb6c1372f87e6a02f7855.mp3' });
    tz.add('video', '', 'pd-vid', {src: 'http://cccimg.com/view.php/30d85f08f6e84acaa27e7201a2f69eba.mp4'}).style('opacity: 0.5;');
    tz.add('img', '', 'ma', { src: 'https://ff.xiaoqiaodali.top:5401/i/2026/03/04/69a8082bb8885.png' }).style('bottom: 60px;').playmp3();

    tz.bgprog().style('bottom: 40px; color: #fefefe; width: 24=280px;');
    tz.fs().style('left: 20px; top: 20px;');

    const lrcString = `
多年前与你不期而遇
追梦的季节
从此开门鲜花也飘洒雨滴
多年后仍难忘记
彷徨的少年期盼重逢
又怕等待与别离
等待与别离
啊......啊大漠起落
你在光阴间吟唱浪漫传奇
曲终人散
有一份温暖始终珍藏心底
多年前与你惊鸿一遇
逐梦的年华
从此吹满星光也洒落诗意
多年后仍常念起
青涩的模样渴望相见，
又惧岁月与疏离
岁月与疏离
啊......时光流转
你在回忆里演绎温柔序曲
聚散有时
有一缕牵挂始终萦绕
心底
`;

    let lines = [];
    let currentActiveIndex = -1;

    // 高级柔和彩虹配色（已优化）
    function getRandomColor() {
      const colors = [
            '#ff6b6b', '#feca57', '#48dbfb', '#ff9ff3', '#1dd1a1',
            '#ff9f43', '#5f27cd', '#00d2d3', '#ff3838', '#7efff5'
      ];
      return colors;
    }

    function initCustomLrc(lrcText) {
      const container = document.getElementById('custom-lrc-container');
      container.innerHTML = '';
      lines = [];
      currentActiveIndex = -1;

      const lineRegex = /\[(\d{2}):(\d{2})\.(\d{2,3})\](.*)/;
      const rawLines = lrcText.split('\n');

      rawLines.forEach(text => {
            const match = text.match(lineRegex);
            if (match) {
                const minutes = parseInt(match);
                const seconds = parseInt(match);
                const milliseconds = parseInt(match);
                const time = minutes * 60 + seconds + milliseconds / 1000;
                const content = match.trim();
                if (content) lines.push({ time, content });
            }
      });

      const audio = document.querySelector('.pa audio');
      if (audio) {
            audio.addEventListener('timeupdate', () => {
                const currentTime = audio.currentTime;
                let activeIndex = -1;
                for (let i = 0; i < lines.length; i++) {
                  if (currentTime >= lines.time) activeIndex = i;
                  else break;
                }
                if (activeIndex !== -1 && activeIndex !== currentActiveIndex) {
                  currentActiveIndex = activeIndex;
                  renderSingleLine(container, lines.content);
                }
            });

            audio.addEventListener('ended', () => {
                container.innerHTML = '';
                currentActiveIndex = -1;
            });

            audio.addEventListener('seeked', () => {
               const currentTime = audio.currentTime;
               let activeIndex = -1;
               for (let i = 0; i < lines.length; i++) {
                  if (currentTime >= lines.time) activeIndex = i;
                  else break;
               }
               if (activeIndex !== -1 && activeIndex !== currentActiveIndex) {
                  currentActiveIndex = activeIndex;
                  renderSingleLine(container, lines.content);
               }
            });
      }
    }

    // 逐字彩色渲染
    function renderSingleLine(container, text) {
      container.innerHTML = '';
      const div = document.createElement('div');
      div.className = 'lrc-line';

      let html = '';
      for (let char of text) {
            const color = getRandomColor();
            html += `<span class="char-color" style="color: ${color};">${char}</span>`;
      }

      div.innerHTML = html;
      container.appendChild(div);
    }

    setTimeout(() => {
      const audioEl = document.querySelector('.pa audio');
      if(audioEl) initCustomLrc(lrcString);
      else {
            const observer = new MutationObserver(() => {
                const aud = document.querySelector('.pa audio');
                if(aud) { initCustomLrc(lrcString); observer.disconnect(); }
            });
            observer.observe(document.querySelector('.pa'), { childList: true, subtree: true });
      }
    }, 500);
</script>

霜染枫丹 发表于 2026-5-14 21:12

画面中的飞机是安二型飞机，80年代可可托海飞乌鲁木齐的飞机。失去动力的时候能够滑翔，挺安全的。从可可托海到乌鲁木齐飞2个小时。机舱内没有座椅，面对面2排木凳子，铺着毛毯，和驾驶舱的隔离是挂了一个门帘。票价34元人民币。机场属于可可托海矿务局资产，飞机是属于民航服务。记不清乘坐过多少次了，我人生第一次坐飞机就是在可可托海乘坐安二型飞乌鲁木齐。

也曾年轻 发表于 2026-5-15 08:18

霜染枫丹 发表于 2026-5-14 21:10
@import 'https://638183.freep.cn/638183/web/tz/tz.v4.css';

    .pa {


https://q5.itc.cn/q_70/images03/20240124/9727e239069b43c1bb8aadd887cd1244.gif

霜染枫丹 发表于 2026-5-15 09:24

也曾年轻 发表于 2026-5-15 08:18


也曾年轻上午好，欢迎您！谢谢你指出问题，我记住了。祝您夏安~~{:4_204:}{:4_190:}

梦江南 发表于 2026-5-15 09:37

霜染枫丹 发表于 2026-5-14 21:10
@import 'https://638183.freep.cn/638183/web/tz/tz.v4.css';

    .pa {


欣赏版主的精彩的音画制作。画面美温馨，歌曲好听！{:4_199:}

霜染枫丹 发表于 2026-5-15 10:14

梦江南 发表于 2026-5-15 09:37
欣赏版主的精彩的音画制作。画面美温馨，歌曲好听！

欢迎梦江南，上午好~~

这个视频是我自己的一段温馨的经历，我是在机场遇到这位朋友，一起乘飞机到乌鲁木齐参加系统的会计培训，做了一年多的同学。到现在一直保持联系。他职务做的比较高，才离职2年多，也想学做播放器让我做个示范，我就做了这个播放器送给他，他很高兴。
我想尝试用AI写自己的故事，这算是试水吧，很高兴得到你支持，祝您夏安~~{:4_204:}{:4_190:}

红影 发表于 2026-5-15 18:19

霜染枫丹 发表于 2026-5-14 21:12
画面中的飞机是安二型飞机，80年代可可托海飞乌鲁木齐的飞机。失去动力的时候能够滑翔，挺安全的。从可可托 ...

枫丹厉害了，坐过这样的飞机的人一定很少吧，非常独特的一段人生经历{:4_199:}

霜染枫丹 发表于 2026-5-15 19:23

本帖最后由 霜染枫丹 于 2026-5-15 19:27 编辑

红影 发表于 2026-5-15 18:19
枫丹厉害了，坐过这样的飞机的人一定很少吧，非常独特的一段人生经历
红影晚上好，欢迎您！
      我是父母还在南疆野云沟自治区的五七干校的时候，被解放了，回老家领的我到身边。野云沟大家不一定知道这个名字，现在的胡杨林景区就在那里。现在也是一个大油田。五七干校很大，属于自治区的让牛鬼蛇神改造的地方，部队在管理。我因此有机会深入地了解了南疆的风貌。在哪里经历了摄氏57度的高温。
       一年后父母恢复工作，我跟随回到了可可托海。当时可可托海飞乌鲁木齐只有安二型飞机。报到时我没能买到机票，做大卡车走了3天才到乌鲁木齐。当时我母亲肝炎，我在乌鲁木齐买到了一些菜籽油和糖，可可托海没有，就请假送回可可托海，回乌鲁木齐和这位朋友邂逅同机抵达，他也是从老家才回来赶去参加培训。
感谢红影的支持，得到支持很高兴，祝你夏安！！{:4_204:}{:4_190:}

红影 发表于 2026-5-15 23:24

霜染枫丹 发表于 2026-5-15 19:23
红影晚上好，欢迎您！
      我是父母还在南疆野云沟自治区的五七干校的时候，被解放了，回老家领的我到 ...

那个时代进干校的都是有本事的人，你父母当年受委屈了。57度高温，也太可怕了，当年又没有空调，咋过啊。

霜染枫丹 发表于 2026-5-16 00:06

红影 发表于 2026-5-15 23:24
那个时代进干校的都是有本事的人，你父母当年受委屈了。57度高温，也太可怕了，当年又没有空调，咋过啊。

父母是解放前参加革命的老党员，雄狮过大江到了南方，解放后在江西工作。一纸调令就带个子弹箱装着简单的物品到了可可托海。到了以后先进山剿匪，然后住帐篷开始建设可可托海矿区。我是在老家祖父母带大的。在南疆高温我就坐在胡杨林利看野兔，百无聊赖，很寂寞。那时情绪很低落。{:4_173:}

红影 发表于 2026-5-16 22:01

霜染枫丹 发表于 2026-5-16 00:06
父母是解放前参加革命的老党员，雄狮过大江到了南方，解放后在江西工作。一纸调令就带个子弹箱装着简单的 ...

你的父母为国做贡献，连自己的亲生女儿都顾不上，小时候的枫丹挺可怜的呢。

霜染枫丹 发表于 2026-5-16 23:01

红影 发表于 2026-5-16 22:01
你的父母为国做贡献，连自己的亲生女儿都顾不上，小时候的枫丹挺可怜的呢。
我是满族人，鳌拜被贬，皇太极也被一起赶走了。我家祖上也跟着离开北京到了现在的辽南老家，跑马占地，定居了下来。对女孩也是散养，我小时候很淘气，书包里总是背着玩的东西，石头，小石子，玩够了才回家，上树掏鸟窝之类的都会有我{:4_173:}过得特别自由。祖父算是有些文化的人，总给我找一些书来看，给我讲过很多道理。到是到了父母身边，一下子朋友也没有了。成天没事做。闲的难受，到干校的游艺室借了一把二胡在胡杨林里瞎拉着玩。干校图书室有很多世界名著，就是哪个阶段看的看了很多。一直到可可托海前，都没有朋友自己瞎跑。比较落寞。{:4_204:}{:4_190:}

红影 发表于 2026-5-16 23:19

霜染枫丹 发表于 2026-5-16 23:01
我是满族人，鳌拜被贬，皇太极也被一起赶走了。我家祖上也跟着离开北京到了现在的辽南老家，跑马占地，定 ...

满族的狩猎习惯，女孩也不娇养，倒是培养了枫丹的豪放性格呢{:4_187:}

查看完整版本: 相遇.缘分