【花潮贺岁】周深《奔腾》（2026 年 1 月 5 日发行）

杨帆发表于 2026-2-10 22:08

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>周深《奔腾》</title>
</head>
<body>
<style>
   #mama{position:relative;display:grid;place-items:center;margin:30px 0;width:1280px;height:780px;left:calc(50% - 81px);transform:translateX(-50%);box-shadow:3px 3px 6px gray;overflow:hidden;z-index:2;--bg1:url('https://cccimg.com/view.php/9e10d3ea1a5836243bc2316f24d94f4f.jpg') no-repeat center/cover;--bg2:url('https://upfile.mp3.wf/view.php/200a891e3f5e630538e886261e3ba402.jpg') no-repeat center/cover;box-shadow:3px 3px 6px gray;overflow:hidden;z-index:1;background:var(--bg1),var(--bg2);--state:running;font-family:'华文行楷',Arial,sans-serif;--state:running;--display:block;}
   #lrc{--state:running;--motion:cover2;--tt:2s;--bg:linear-gradient(45deg,#ff0000,#ff6600,#ffff00);position:absolute;z-index:6;left:7%;top:10%;transform:translateX(-50%);font:normal 2.8em 华文新魏;font-weight:400;color:#8A2BE2;white-space:pre;writing-mode:vertical-lr;background-clip:text;-webkit-background-clip:text;filter:drop-shadow(#FFFFFF 1px 0 0) drop-shadow(#FFFFFF 0 1px 0) drop-shadow(#FFFFFF -1px 0 0) drop-shadow(#FFFFFF 0 -1px 0);--rect:0 0 100% 0;--border:0 1px 0 0;--c2:#F5F5F5;}
   #lrc::before{position:absolute;content:attr(data-lrc);width:100%;height:100%;color:transparent;overflow:hidden;white-space:pre;animation-play-state:var(--state);background:var(--bg);clip-path:inset(0 0 100% 0);-webkit-background-clip:text;animation:var(--motion) var(--tt) linear forwards var(--state);clip-path:inset(var(--rect));border:0px groove var(--c2);border-width:var(--border);}
   @keyframes cover1{to{clip-path:inset(0 0 0 0);}}
   @keyframes cover2{to{clip-path:inset(0 0 0 0);}}
   #mplayer{position:absolute;width:80px;height:80px;cursor:pointer;color:var(--color);animation:pprot 6s infinite linear var(--state);--deg:360deg;--color:Gold;--len:3px;}
   #mplayer::before{position:absolute;content:attr(data-tt);width:100%;height:100%;display:grid;place-items:center;white-space:pre;font:normal 14px sans-serif;animation:pprot 6s infinite linear var(--state);--deg:-360deg;}
   .pinpu{display:grid;place-items:center end;position:absolute;right:50%;top:calc(50% - var(--len));width:20px;height:var(--len);transform-origin:100% 100%;animation:ppgo var(--du) var(--dl) infinite alternate var(--state);--du:0.5s;--dl:0s;}
   .pinpu::after{content:'';position:absolute;right:calc(var(--len) / -2);width:var(--len);height:var(--len);background:var(--color);border-radius:50%;}
   @keyframes ppgo{from{width:0px;}to{width:50px;}}
   @keyframes pprot{to{transform:rotate(var(--deg));}}
   #vid1{position:absolute;inset:0;left:0%;top:0%;width:100%;height:100%;object-fit:cover;pointer-events:none;opacity:.9;}
   #vid2{position:absolute;inset:0;left:-10%;top:-10%;width:120%;height:120%;object-fit:cover;pointer-events:none;opacity:.9;}
   .vid{position:absolute;inset:0;left:0%;top:0%;width:100%;height:100%;object-fit:cover;pointer-events:none;opacity:.8;display:var(--display);mask:linear-gradient(to bottom,red 20%,transparent 41%,transparent);-webkit-mask:linear-gradient(to bottom,red 20%,transparent 41%,transparent);}
   #fullscreen{position:absolute;bottom:20px;left:20px;font:normal 1.5em 楷体;color:#fff;text-shadow:0 0 3px #000;opacity:1;cursor:pointer;z-index:10;}
   #fullscreen:hover{font-style:italic;}
   #baiBox{position:absolute;width:100%;height:auto;line-height:1.5;left:0;top:1%;z-index:8;overflow:hidden;white-space:nowrap;}
   #baiBox .tit{position:relative;display:inline-block;font:bold 2em/1.5 STXingkai;filter:drop-shadow(#fff 1px 0 0) drop-shadow(#fff 0 1px 0) drop-shadow(#fff -1px 0 0) drop-shadow(#fff 0 -1px 0);color:#e91e63;letter-spacing:4px;transition:all .5s ease;animation:scroll-left 20s linear infinite var(--state);}
   #baiBox:hover .tit{filter:hue-rotate(0deg);transform:scale(1.2);animation-play-state:paused!important;}
   @keyframes scroll-left{0%{transform:translateX(0%);}100%{transform:translateX(-50%);}}
</style>
<div id="mama">
   <div id="baiBox">
         <div class="tit">
            <span>周深倾情演唱的人民日报新媒体新年主题曲《奔腾》，励志动听，2026 年 1 月 5 日发行，是送给追梦人的新年礼物……</span>
            <span>周深倾情演唱的人民日报新媒体新年主题曲《奔腾》，励志动听，2026 年 1 月 5 日发行，是送给追梦人的新年礼物……</span>
         </div>
   </div>
   <audio id="aud" src="https://upfile.mp3.wf/view.php/d7bc9f671dac454e84b83febf92097e3.mp3" autoplay loop></audio>
   <div data-lrc="" id="lrc"></div>
   <video id="vid1"
src="https://video-qn.51miz.com/preview/video/00/00/15/18/V-151809-637CF87A.mp4" autoplay loop muted></video>
   <video class="vid" src="https://cccimg.com/view.php/7f9f1d52f7c575953b6957576cd5d0b2.mp4" autoplay loop muted></video>
      <video id="vid2" class="vid" src="https://img.tukuppt.com/video_show/2475824/00/01/72/5b492fae7af99.mp4" autoplay loop muted></video>
   <span id="fullscreen" title="">全屏欣赏</span>
</div>
<script>
(function(){
   const config={papa:'#mama',pinpu:{num:40,color:'linear-gradient(to right, transparent, green, lightgreen)'},player_css:'right:5%; bottom: 5%; --color: Gold; --len: 3px;',skip:0,average:0};
   let papa=document.querySelector(config.papa);
   if(!papa){console.error('播放器容器不存在！');return;}
   const playerHTML=`<div id="mplayer" data-tt="00:00
00:00" ></div>`;
   papa.innerHTML+=playerHTML;
   let mplayer=document.getElementById('mplayer');
   let aud=papa.querySelector('audio');
   let vids=papa.querySelectorAll('video');
   if(!aud){console.error('容器内未找到音频元素！');return;}
   mplayer.style.cssText+=config.player_css;
   let ppnum=config.pinpu.num||60;
   Array.from({length:ppnum}).forEach((item,key)=>{
         item=document.createElement('span');
         item.className='pinpu';
         let bg=config.pinpu.color?config.pinpu.color:`#${Math.random().toString(16).substring(2,8)}`;
         item.style.cssText+=`background: ${bg};transform: rotate(${360 / ppnum * key}deg) translate(-40px);--du: ${.2 + Math.random() * .2}s;--dl: -${Math.random()}s;`;
         mplayer.appendChild(item);
   });
   let mState=()=>{
         papa.style.setProperty('--state',aud.paused?'paused':'running');
         vids.forEach(vid=>aud.paused?vid.pause():vid.play());
         mplayer.title=aud.paused?'播放':'暂停';
         papa.style.setProperty('--bg1',aud.paused?'none':'');
         papa.style.setProperty('--bg2',aud.paused?'':'none');
         papa.style.setProperty('--display',aud.paused?'none':'');
   };
   let toMin=(val)=>{
         if(!val)return '00:00';
         let min=parseInt(val/60),sec=Math.floor(val)%60;
         if(sec<10)sec='0'+sec;
         return min+':'+sec;
   };
   aud.addEventListener('timeupdate',()=>{
         mplayer.dataset.tt=toMin(aud.currentTime)+'\n'+toMin(aud.duration);
   });
   mplayer.onclick=()=>{aud.paused?aud.play():aud.pause();};
   aud.addEventListener('pause',()=>mState());
   aud.addEventListener('play',()=>mState());
   aud.oncanplay=mState;
})(this);
const aud=document.getElementById('aud');
(function(){
   const lrcStr=`奔腾 - 周深
人民日报新媒体新年主题曲
2026 年 1 月 5 日发行
词：欣声
曲：陈禹@向心·引力
制作人：陈禹@向心·引力王中桥@向心·引力
编曲：陈禹
录音/配唱制作人：徐威52Hz Studio Shanghai
录音棚：55tec Studio
弦乐：国际首席爱乐乐团
弦乐指导：李朋
弦乐录音：董方昱@九紫天诚录音棚
木吉他：李萌
电吉他：李萌
和声设计：陈禹
和声：高一琳
混音/母带：周天澈@Studio21A
监制：薛原/余荣华/傅鸿城/杨奇虎
策划：曹磊/杨丽娟/朱利
项目总监：张柏生/戚雯
音乐总监：杨杰@QQ音乐·新鲜制造工作室
音乐统筹：高杨@QQ音乐·新鲜制造工作室
出品：人民日报社新媒体中心
联合出品：腾讯音乐娱乐集团（新鲜制造工作室）
制作单位：腾讯音乐娱乐集团（新鲜制造工作室）
特别鸣谢：周深工作室
以为驰骋千万里
已然遨游天际
不知是谁破了局
又是谁将我唤起
险象环生的境地
能否等来逆袭
纵然是如蜉蝣于天地
也争一线生机
世上人皆行色匆匆
向前走倔强而奋勇
世上路虽有千万种
总有一条能通往顶峰
就让我踏过千万重
穿越了风雨怎不见彩虹
仰望着如梦的星空
任热血翻涌
我偏要在漫漫征途中
跨越这山海得见晴空
但由我乘九天长风
做云上的鲲鹏自在如风
世上人皆行色匆匆
向前走倔强而奋勇
世上路虽有千万种
总有一条能通往顶峰
就让我踏过千万重
穿越了风雨终能见彩虹
仰望着如梦的星空任热血翻涌
哦
我偏要在漫漫征途中
跨越这山海触摸晴空
但由我乘九天长风做云上的鲲鹏
自在如风
自在如风
哦
就让我踏过千万重
穿越了风雨终能见彩虹
仰望着如梦的星空任热血翻涌
哦
我偏要在漫漫征途中
跨越这山海触摸晴空
但由我乘九天长风做云上的鲲鹏
自在如风
啊
自在如风`;
   let mKey=0;
   let mFlag=true;
   const averAdd=0.3;
   let lrcAr=[];
   const lrcTime=(ar)=>{
         const tmpAr=[];
         for(let j=0;j<ar.length;j++){
            if(j<ar.length-1){
               tmpAr=parseFloat((ar-ar).toFixed(1));
            }else{
               const avg=tmpAr.reduce((a,b)=>a+b)/tmpAr.length;
               tmpAr=parseFloat(avg.toFixed(1));
            }
         }
         tmpAr.forEach((item,key)=>{
            ar=item;
         });
         return ar;
   };
   const getLrcAr=(text)=>{
         const arr=[];
         const calcRule=;
         const lines=text.split('\n');
         lines.forEach(line=>{
            const geci=line.replace(/\d+[\.:]\d+([\.:]\d+)?/g,'').replace(/[\[\]\'\"\t,]s?/g,'').trim();
            if(!geci)return;
            const timeMatch=line.match(/\d+[\.:]\d+([\.:]\d+)?/g);
            if(!timeMatch)return;
            timeMatch.forEach(timeStr=>{
               const timeArr=timeStr.match(/\d+/g);
               let sec=0;
               timeArr.forEach((val,idx)=>{
                     sec+=val*calcRule;
               });
               arr.push();
            });
         });
         arr.sort((a,b)=>a-b);
         return lrcTime(arr);
   };
   const showLrc=(time)=>{
         if(mKey>=lrcAr.length)mKey=0;
         const name=mFlag?'cover1':'cover2';
         lrc.innerText=lrcAr;
         lrc.dataset.lrc=lrcAr;
         lrc.style.setProperty('--motion',name);
         lrc.style.setProperty('--tt',time+'s');
         lrc.style.setProperty('--state',aud.paused?'paused':'running');
         mKey++;
         mFlag=!mFlag;
   };
   const calcKey=()=>{
         for(let j=0;j<lrcAr.length;j++){
            if(aud.currentTime<=lrcAr){
               mKey=j-1;
               break;
            }
         }
         if(mKey<0)mKey=0;
         if(mKey>=lrcAr.length)mKey=lrcAr.length-1;
         const time=lrcAr-(aud.currentTime-lrcAr);
         showLrc(time);
   };
   lrcAr=getLrcAr(lrcStr);
   aud.addEventListener('timeupdate',()=>{
         if(aud.paused)return;
         for(let j=mKey;j<lrcAr.length;j++){
            if(aud.currentTime>=lrcAr&&mKey===j){
               showLrc(lrcAr);
               break;
            }
            if(mKey>=lrcAr.length){
               mKey=0;
            }
         }
   });
   aud.addEventListener('pause',()=>{
         lrc.style.setProperty('--state','paused');
   });
   aud.addEventListener('play',()=>{
         lrc.style.setProperty('--state','running');
   });
   aud.addEventListener('seeked',calcKey);
   showLrc(lrcAr);
})();
const fullscreen=document.getElementById('fullscreen');
let fs=true;
let fsTimer;
fullscreen.onclick=()=>{
   fs?(fullscreen.innerText='退出全屏',mama.requestFullscreen()):(fullscreen.innerText='全屏欣赏',document.exitFullscreen());
   fs=!fs;
};
mama.addEventListener('mousemove',()=>{
   clearTimeout(fsTimer);
   fullscreen.style.opacity='1';
   fsTimer=setTimeout(()=>{
         fullscreen.style.opacity='0';
   },3000);
});
</script>
</body>
</html>

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

欣赏扬帆贺岁佳作，赞佩学习！祝小年快乐！

https://www.yueyijyw.com/data/attachment/forum/202602/10/160836fyylx6h86iztkt3x.jpg

偶然~ 发表于 2026-2-10 22:24

杨帆老师制作的音画周深《奔腾》（2026年1月5日发行）太赞啦！

偶然~ 发表于 2026-2-10 22:26

将周深的歌声与夜空下的露营场景完美融合，帐篷在星光下如萤火虫般温暖，彩虹横跨天际，把歌曲的激昂与画面的静谧奇妙结合，让听众在旋律中感受自然之美，视觉与听觉双重享受。

偶然~ 发表于 2026-2-10 22:27

杨帆老师的创意和用心，让作品充满温度与感染力，祝您健康快乐，继续创作更多精彩作品！

偶然~ 发表于 2026-2-10 22:27

迎新纳福小年至，祝杨帆老师好运似繁星，喜事连连福满堂！

杨帆发表于 2026-2-10 23:02

霜染枫丹发表于 2026-2-10 22:22
欣赏扬帆贺岁佳作，赞佩学习！祝小年快乐！

问好枫丹，谢谢鼓励，祝小年快乐{:4_204:}

杨帆发表于 2026-2-10 23:04

偶然~ 发表于 2026-2-10 22:26
将周深的歌声与夜空下的露营场景完美融合，帐篷在星光下如萤火虫般温暖，彩虹横跨天际，把歌曲的激昂与画面 ...

问好偶然~，谢谢雅评与鼓励，祝兄弟小年快乐{:4_176:}

偶然~ 发表于 2026-2-10 23:14

杨帆发表于 2026-2-10 23:02
问好枫丹，谢谢鼓励，祝小年快乐

驫驫而来送瑞祥，论坛笑语贺年昌

红影发表于 2026-2-11 08:20

这么新的歌，太赞了。这制作也漂亮，和歌曲的意境相互呼应，非常好。
欣赏扬帆好帖{:4_199:}

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

很喜欢周深的歌，声音好，演唱也专业。深深这个人也特别好，非常实在。
感谢扬帆带来的好歌，听了好几遍呢{:4_187:}

樵歌发表于 2026-2-11 10:37

画面和歌声带给人无限想往。{:4_199:}

梦油发表于 2026-2-11 11:12

浪漫的画面给人一种飘渺的感觉。{:5_116:}

杨帆发表于 2026-2-11 13:24

红影发表于 2026-2-11 08:20
这么新的歌，太赞了。这制作也漂亮，和歌曲的意境相互呼应，非常好。
欣赏扬帆好帖

问好影子，谢谢雅评与鼓励，祝新春快乐{:4_204:}

杨帆发表于 2026-2-11 13:25

樵歌发表于 2026-2-11 10:37
画面和歌声带给人无限想往。

问好樵歌，谢谢鼓励，祝新春快乐{:4_176:}

杨帆发表于 2026-2-11 13:25

梦油发表于 2026-2-11 11:12
浪漫的画面给人一种飘渺的感觉。

问好梦兄，谢谢鼓励，祝新春快乐{:4_190:}

梦油发表于 2026-2-11 16:33

杨帆发表于 2026-2-11 13:25
问好梦兄，谢谢鼓励，祝新春快乐

杨帆朋友别客气。

红影发表于 2026-2-11 20:58

杨帆发表于 2026-2-11 13:24
问好影子，谢谢雅评与鼓励，祝新春快乐

问好扬帆，还是第一次听到这歌，感谢扬帆带来的好帖{:4_187:}

杨帆发表于 2026-2-11 21:01

红影发表于 2026-2-11 20:58
问好扬帆，还是第一次听到这歌，感谢扬帆带来的好帖

是，刚发行，一首新歌，祝新春大吉{:4_204:}

红影发表于 2026-2-11 22:05

杨帆发表于 2026-2-11 21:01
是，刚发行，一首新歌，祝新春大吉

特别新的新歌呢，扬帆厉害，找到这么好的歌{:4_187:}

页: [1]

花潮论坛's Archiver

【花潮贺岁】周深《奔腾》（2026 年 1 月 5 日发行）