论坛 › 音乐沙龙 › 《流淌的歌声 20CD》（CD11-CD15）选听

亦是金 发表于 2023-9-1 06:48

《流淌的歌声 20CD》（CD11-CD15）选听

<div class="cont-area">

<div style="width: 1200px;height: 710px;box-shadow:0px 0px 1px 2px #045768, 0px 0px 0px 8px #99e5f5,0px 0px 5px 15px #045768;overflow:hidden;border-radius:1%;margin-top:20px;margin-LEFT: -310px;">



<div style="position:relative;width: 1200px;height: 710px;overflow:hidden;top: 0px;left: 0px;">
<div style="left: 0px;position:absolute;top: 0px;">


<div style="z-index: !;width: 1350px; height: 710px; top:0px; left:0px;   overflow: hidden;transform:rotate(0deg);background-size: 100% 100%;background-image:url(); text-align: center;">
<metaname="referrer" content="never">
<video frameborder="0" src="
https://ysj147.s3-us-east-1.ossfiles.com/zzsc/mp4/37pp01.mp4" autoplay muted loop="" controls="" style="position:absolute;left:-20px;top:-50px;background:#000 ;width:1400px; height: 830px;>

<div style="color:#f88;font-size:2.5em;margin-left:560px;top:0px;"></div>

<img class=&lazyload bg-gif" src="https://z3.ax1x.com/2021/08/26/hujGMd.gif" data-original="" title="" alt="" style="z-index: 1;POSITION: relative; TOP: -160px;LEFT:150px;height: 70px; margin: 0px;border-radius:3%background-color: rgb(255, 255, 255); display: block;">
</div>


</style>
</div>


<style>
#wrapper {
      position: absolute;
      display: flex;
      width: fit-content;
      height: fit-content;
      /* border仅用于观察 */
      border: 1px solid red;
}
#mydiv {
      position: absolute;
      top: -185px;
      left: 370px;
      width: 500px;
      height: 185px;
      display: flex;
      justify-content: center;
      align-items: center;


}
#copydiv { transform: rotateY(-180deg); }
pin-pu {
      margin-right: 1px;
      width: 1px;
      height: 10px;
      background: blue;
      animation: change .4s var(--delay) infinite alternate linear;
}
@keyframes change {
      from { height: 2px; }
      to { height: var(--hh); }
}
</style>

<div id="wrapper">
      <div id="mydiv"></div>
      <div id="copydiv"></div>
</div>

<script>

/* 除以几依据 pin-pu 标签的 width + 希望的间隔值即 margin-right 值 */
let total = Math.ceil(mydiv.offsetWidth / 2);

Array.from({length: total}).forEach((item,key) => {
      item = document.createElement('pin-pu');
      item.style.cssText += `
                background: #${Math.random().toString(16).substr(-6)};
                height: ${Math.random() * mydiv.offsetHeight}px;
                --hh: ${mydiv.offsetHeight / 2 + Math.random() * mydiv.offsetHeight / 2}px;
                --delay: -${Math.random()}s;
      `;
      mydiv.appendChild(item);
});

let node = mydiv;
let clone = node.cloneNode(true);
copydiv.appendChild(clone);

</script>


<style type="text/css">

@keyframes mv { from { background-position: 1200px 0; } to { background-position: 0 0; } }

body { overflow-x: hidden; }
#baiBox {
      margin: auto;
      width: 800px;
      text-align: center;
      font-family:微软简中圆;
      font-size: 2.5rem;
      font-weight: bold;
      color: #f46ff6;
      transform-origin: top;
      animation: yao 1.0s linear infinite alternate;
}

@keyframes yao {
      from{transform: perspective(800px) rotatex(30deg); }
      to { transform: perspective(800px) rotatex(-30deg); }
}



.tit { position: relative;width: 300px;height: 30px;top:-690px;LEFT: -330px;z-index: 100;filter: drop-shadow(-1px 1px 1px #ffffff)drop-shadow(0px -1px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff) }
#tit:hover { color: green; }
/*标题位置 移动范围设置*/

</style>

<div id="hu" >
<div id="baiBox"
<div class="tit">
<span style="color:#fb52f9;"><span style="font-size:30px;">《流淌的歌声 20CD》</span>
<span style="color:#3d46f7;"><span style="font-size:22px;">   （CD11-CD15）选听</span></div>



<div style="position: relative;width: 500px;height: 50px;top:-100px;LEFT: 980px;z-index: 100;filter: drop-shadow(-1px 1px 1px #e8f552)drop-shadow(0px -1px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)">
<p><span style="color:#ff0000;"><span style="font-family:华文隶书;"><span style="font-size:26px;">亦是金在线音乐</span></span></span></p></div>

</style>


<div style="position: relative; top:-740px;LEFT: 80px;z-index: 12435;">
<style type="text/css">
.lyricDisp{-webkit-text-stroke:1.5px #ffffff;font: bold 2.2em悟空大字库, sans-serif; transition:.3s all ease;font-size:2.2em;}
.lyricDisp:nth-child(1){color:#000080;text-align:left;--aniName:bgMove1;--durTime:100ms;--aniPlayState:running;}
.lyricDisp:nth-child(1)::before{position:absolute;content:attr(data-lrc);width:0;height:100%;left:0;top:0;color: transparent;background: linear-gradient(45deg, #F32121 32%,#8EE73C 43%,#FEFFFF 52%,#091CFD 62%,#36F4B1 75%);-webkit-background-clip: text;-webkit-text-stroke:2px #000000;filter: contrast(110%)brightness(160%);overflow:hidden;white-space:nowrap;animation:var(--aniName) var(--durTime) linear forwards;animation-play-state:var(--aniPlayState);}
.lyricDisp:nth-child(2){color:blue;text-align:center;font-size:1.6em;}@keyframes bgMove1{from{width:0;}to{width:100%;}}@keyframes bgMove0{from{width:0;}to{width:100%;}}
#LRCShow{position:absolute;left:300px;bottom:-40px;width:75%;height:120px;margin:6px auto position:relative;<!--歌词位置-->}
#rdisk{position:absolute;left:5px;bottom:0px;border-radius: 50%;font-size:4em;color:red;animation:circleSmall2 6s linear infinite;animation-play-state:paused;cursor:pointer;<!--光盘位置-->}
@keyframes circleSmall2{0%{transform:rotateX(0deg) rotateY(20deg) rotateZ(360deg);}100%{transform:rotateX(0deg) rotateY(20deg) rotate(0deg);}}
#ground3rd{
        width:1000px;height:600px;
        position:absolute;font-size:16px;
        overflow:hidden;border-radius:0px;
        margin:5px 0px 30px -5px;
background:url(https://s4.ax1x.com/2022/03/05/bwbPNq.jpg);
        background-position:center;
        background-size: cover;
      perspective: 1200px;
}

#mpic {
        position: absolute;
        transform: rotateY(0deg);
        top: 0px;
        left: 0px;
        width: 1000px;
        height: 600px;
        animation: rote 80s linear infinite;
        cursor: pointer;
        opacity: 1;
}

@keyframes rote {
        from {
                background-position: 0 0;
                filter: hue-rotate(360deg)
        }

        to {
                background-position: -1730px 300px;
        }
}

#mpic1 {
        position: absolute;
        transform: rotateY(0deg);
        top: 0px;
        left: 0px;
        width: 1000px;
        height: 600px;
        animation: rotet 100s linear infinite;
        cursor: pointer;
        opacity: 1;
}

@keyframes rotet {
        from {
                background-position: 0 0;
                filter: hue-rotate(360deg)
        }

        to {
                background-position: 0px -1730px;
        }
}


#songList li {
        cursor: pointer;
        color: #ffffff;
        font:thick微软简中圆;
      font-size:18px;
      line-height:28px
}
</style>




<div id="ground3rd">
<div class="itemm">

<div style="width: 1000px;height: 600px;box-shadow:0px 0px 1px 2px #045768, 0px 0px 0px 8px #99e5f5,0px 0px 5px 15px #045768;overflow:hidden;border-radius:1%;margin-top:0px;margin-LEFT: 0px;">
<div style="position:relative;width: 1000px;height: 600px;overflow:hidden;top: 0px;left: 0px;">
<div style="left: 0px;position:absolute;top: 0px;">

</div>
<ol id='songList' style="color:red;position:absolute;top:30px;left:0px;"><!--歌曲菜单位置--></ol>
    <div id="rdisk"style="width:100px;height:100px;border: 0px solid #000000;
        background: url('https://i.ibb.co/PzGxWN7/image.png')0 0/100% 100%,conic-gradient(red,orange,yellow,green,teal,blue,#ff0000);
        mask: radial-gradient(transparent 7px,#red 0);transform: rotateX(45deg) rotateY(20deg) rotate(0deg);"></div>
    <div id="LRCShow"></div>
</div>


<!-- 下面一句是存放歌词的标签        -->
<textarea style="visibility:hidden;" id='lrcContent0'></textarea>

<script type="text/javascript">
var lrcPlayer2=function(){return this.init.apply(this,arguments)};lrcPlayer2.prototype={constructor:lrcPlayer2,init:function(opts){this.lyricTxtObj=document.getElementById(opts.lrcTxtID);lyricTxt=this.lyricTxtObj.innerHTML;this.showLrcObj=document.getElementById(opts.lrcShowID);this.gclines=new Array();for(k=0;k<2;k++){this.gclines=document.createElement('div');this.gclines.className='lyricDisp';this.showLrcObj.appendChild(this.gclines)}this.audioCtrl=document.getElementById(opts.audioCtrl);this.handleLrc(lyricTxt);this.genPlayer(opts.audioURL)},handleLrc:function(lyricTxt){this.lrcVec=new Array();var lyriclist=lyricTxt.split(/\r|\n|\r\n/);for(n=0;n<lyriclist.length;n++){chkTime=lyriclist.match(/\[\d{1,2}:\d{2}.\d{1,3}\]|\[\d{1,2}:\d{2}\]/g);if(chkTime){tIdx=lyriclist.lastIndexOf(']');if(tIdx>0)lrcTxt=lyriclist.substr(tIdx+1);for(m=0;m<chkTime.length;m++){ta=chkTime.substr(1).replace(']','').split(/:/);_t=(+ta)*60+(+ta);if(this.lrcVec.length==0&&_t!=0){this.lrcVec.push()}this.lrcVec.push()}}}this.lrcVec.sort(function(a,b){return(a-b)})},showLrc:function(durTime){this.gclines.innerHTML=this.gclines.dataset.lrc=this.lrcVec.length>0?this.lrcVec:"\u3000";this.gclines.style.setProperty('--aniName','bgMove'+(this.idx%2));this.gclines.style.setProperty('--durTime',durTime+'ms');this.gclines.style.setProperty('--aniPlayState','running')},genPlayer:function(mUrl){this.mObj=document.createElement("audio");this.mObj.loop=false;this.mObj.muted=false;this.mObj.src=mUrl;this.showLrcObj.appendChild(this.mObj);this.idx=0;var that=this;this.mObj.addEventListener('ended',function(){that.idx=0});this.mObj.addEventListener('playing',function(){that.audioCtrl.style.animationPlayState='running';that.gclines.style.setProperty('--aniPlayState','running')});this.mObj.addEventListener('pause',function(){that.audioCtrl.style.animationPlayState='paused';that.gclines.style.setProperty('--aniPlayState','paused')});this.mObj.addEventListener('error',function(){console.log("audio wrong, remove play start event");that.showLrcObj.style.display='none';that.showLrcObj.removeChild(this)});this.mObj.addEventListener('timeupdate',function(){if(this.currentTime>that.lrcVec){if(that.idx<(that.lrcVec.length-1)){that.showLrc((that.lrcVec-that.lrcVec)*950)}else{that.showLrc((this.duration-that.lrcVec)*950)}if(that.idx+1==that.lrcVec.length){that.gclines.innerHTML=""}else{that.gclines.innerHTML=that.lrcVec}that.idx++}});this.audioCtrl.onclick=function(){if(that.mObj.paused){that.mObj.play()}else{that.mObj.pause()}};try{this.mObj.play()}catch(err){console.log(err.message)}},stopMusic:function(){this.mObj.pause();this.mObj.controls=false;},setAudioUrl:function(mUrl){this.mObj.src=mUrl},isMusicEnd:function(){return this.mObj.ended},reStart:function(){this.idx=0;this.mObj.play()}}
</script>

<script type="text/javascript">
(function()        {
songParas = [
["《故乡的云》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1401.mp3",`《故乡的云》 - 梦之旅
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十四)
LRC编辑：亦是金
● ● ● ● ● ●
天边飘过故乡的云
它不停地向我召唤
当身边的微风轻轻吹起
有个声音在对我呼唤

归来吧 归来哟
浪迹天涯的游子
别再四处漂泊
踏着沉重的脚步
离乡路是那样漫长
吹来故乡泥土的芬芳
我已厌倦漂泊
我已是满怀疲惫
眼里是酸楚的泪
那故乡的风 那故乡的云
为我抹去创痕
我曾经豪情万丈
归来却空空的行囊
为我抚平创伤
-- 谢谢欣赏 --`],
["《神奇的九寨》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1105.mp3",`神奇的九寨
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十一)
LRC编辑：亦是金
● ● ● ● ● ●
在离天很近的地方
总有一双眼睛在守望
她有着森林绚丽的梦想
她有着大海碧波的光芒

到底是谁的呼唤
那样真真切切
到底是谁的心灵
那样寻寻觅觅
噢呵～ 神奇的九寨
噢呵～ 人间的天堂
你把那温情的灵光
噢 洒遍山岗
你看那天下人儿
噢深情向往
在离我很远的地方
总有一枝花朵在芬芳
她有着生命祈求的梦想
她有着日月轮回的沧桑
你把那童话的世界
噢 铺满高原
深情向往
向往
呀哈啦哎～ 呀哈啦哎～
喔～
-- 谢谢欣赏 --`],
["《读 你》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1107.mp3",`《读 你》 - 梦之旅
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十一)
LRC编辑：亦是金
● ● ● ● ● ●
读你千遍也不厌倦
读你的感觉像三月
浪漫的季节 醉人的诗篇
唔～

读你的感觉象春天
喜悦的经典 美丽的诗篇
你的眉目之间 锁着我的爱怜
你的唇齿之间 留着我的誓言
你的一切移动 左右我的视线
你是我的诗篇 读你千遍也不厌倦
读你 读你
读你
-- 谢谢欣赏 --`],
["《鼓浪屿之波》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1109.mp3",`《鼓浪屿之波》 - 梦之旅
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十一)
LRC编辑：亦是金
● ● ● ● ● ●
鼓浪屿四周海茫茫
海水鼓起波浪
鼓浪屿遥对台湾岛
台湾是我家乡

登上日光岩眺望
只见云海苍苍
我渴望 我渴望
快快见到你
美丽的基隆港
母亲生我在台湾岛
基隆港把我滋养
我紧紧依偎着老水手
听他讲海龙王
那迷人的故事吸引我
他娓娓的话语记心上
咚巴拉 巴拉巴拉
咚咚 巴拉巴拉巴拉
咚咚 巴拉 咚巴拉巴拉
鼓浪屿海波在日夜唱
唱不尽骨肉情长
淘不干海峡的思乡水
思乡水鼓动波浪
思乡思乡啊 思乡
鼓浪鼓浪啊 鼓浪
-- 谢谢欣赏 --`],
["《三月里的小雨》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1203.mp3",`《三月里的小雨》 - 梦之旅
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十二)
LRC编辑：亦是金
● ● ● ● ● ●
淅沥沥沥 淅沥沥沥
哗啦啦啦 哗啦啦啦
哈～

淅沥沥沥 沥沥
淅沥沥沥下个不停
山谷里的小溪
哗啦啦啦 啦啦
哗啦啦啦流不停
小雨为谁飘
小溪为谁流
带着满怀的凄清
叽喳叽喳 叽喳叽喳
小雨陪伴我
小溪听我说
可知我满怀的寂寞
请问小溪
谁带我追寻 追寻
那一颗爱我的心
哗啦啦啦啦
-- 谢谢欣赏 --`],
["《微 山 湖》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1208.mp3",`《微 山 湖》 - 梦之旅
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十二)
LRC编辑：亦是金
● ● ● ● ● ●
微山湖喂 阳光闪耀
片片白帆好象云儿飘
是谁又在弹响 土琵琶
听春风传来一片歌谣

哎嗨哟～ 哎嗨依儿哟～
俺铁道游击队 啊～
为国为民立下大功劳
嗨哟
微山湖喂 卷起春潮
朵朵浪花在把英雄找
当年抗日健儿何处去
看青松巍巍 绿水涛涛
丰功伟绩人民永远忘不了
人民永远忘不了
哎嗨哟～
-- 谢谢欣赏 --`],
["《小 白 杨》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1212.mp3",`《小 白 杨》 - 梦之旅
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十二)
LRC编辑：亦是金
● ● ● ● ● ●
一棵呀小白杨
长在哨所旁
根儿深 杆儿壮
守望着北疆

微风吹
吹得绿叶沙沙响啰喂
太阳照得
绿叶闪银光
来来来来来 来来来
来来来来来来来来
小白杨 小白杨
它长我也长
同我一起守边防
来 来来来
也穿绿军装
当初呀离家乡 告别杨树庄
妈妈送树苗 对我轻轻讲
带着它 亲人嘱托记心上啰喂
栽下它 就当故乡在身旁
咚 加啦加啦加啦加啦
加啦加啦加啦加啦
一起守边防
-- 谢谢欣赏 --`],
["《蒙 古 人》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1301.mp3",`《蒙 古 人》 - 梦之旅
---梦之旅合唱组合---
专辑：流淌的歌声之真情依旧(十三)
LRC编辑：亦是金
● ● ● ● ● ●
洁白的毡房炊烟升起
我出生在牧人家里
辽阔的草原
是抚育我成长的摇篮

养育我的这片土地
当我身躯一样地爱惜
哺育我的江河水
母亲的乳汁一样甘甜
这就是
这就是热爱故乡的人
-- 谢谢欣赏 --`],
["《篱笆墙的影子》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1303.mp3",`正在播放：《篱笆墙的影子》 - 梦之旅`],
["《拉兹之歌》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1306.mp3",`正在播放：《拉兹之歌》 - 梦之旅`],
["《我们的生活充满阳光》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1414.mp3",`正在播放：《我们的生活充满阳光》 - 梦之旅`],
["《党旗飘飘》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1415.mp3",`《党旗飘飘》正在播放： - 梦之旅`],
["《我爱祖国的大草原》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1501.mp3",`正在播放：《我爱祖国的大草原》 - 梦之旅`],
["《南屏晚钟》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1508.mp3",`正在播放：《南屏晚钟》 - 梦之旅`],
["《踏 浪》 - 梦之旅","","https://ysj147.s3-us-east-1.ossfiles.com/ltdgs03/1512.mp3",`正在播放：《踏 浪》 - 梦之旅`],

];

var opts = {
        lrcTxtID:'lrcContent0',
        lrcShowID:"LRCShow",
        audioURL:"https://www.qqmc.com/up/kwlink.php?id=60010502&.mp3",
        audioCtrl:'rdisk'
};
var km = null;
var idx = 0;
let songList = document.getElementById('songList');

        for(n = 0; n < songParas.length; n++)        {
                let item = document.createElement('li');
                item.id = 's'+n;
                item.innerHTML = songParas;
               
                songList.appendChild(item);
        }

        items = songList.getElementsByTagName('li');
       
        for(n = 0 ; n < items.length; n++)        {
                items.onclick=function()        {
                        idx = parseInt(this.id.substr(1));
                        document.getElementById('ground3rd').style.backgroundImage = `url(${songParas})`;
                        if(km){
                                km.stopMusic();
                                //km = null;
                                km.handleLrc(songParas);
                                km.setAudioUrl(songParas);
                                km.reStart();
                        }
                        else        {
                                document.getElementById(opts.lrcTxtID).innerHTML = songParas;
                                opts.audioURL=songParas;
                                km = new lrcPlayer2(opts);
                        }
                }
        }
        items.click();

setInterval(() => {
        if(km)        {
                items = songList.getElementsByTagName('li');
                if(km.isMusicEnd())        {
                        idx++; idx %= items.length;
                        items.click();
                }
        }
        //setTimeout(isSongEnded, 500);
}, 500);

})();
</script>

醉美水芙蓉 发表于 2023-9-1 07:08

亦是金 发表于 2023-9-1 07:17

问好水芙蓉！{:4_187:}这个频谱是装饰的，与歌曲无关联！{:4_173:}

红影 发表于 2023-9-1 10:01

又是这么多梦之旅的专辑里的歌曲。制作漂亮，歌曲好听。欣赏亦是金老师好帖{:4_199:}

亦是金 发表于 2023-9-1 10:15

红影 发表于 2023-9-1 10:01
又是这么多梦之旅的专辑里的歌曲。制作漂亮，歌曲好听。欣赏亦是金老师好帖

问好红影！{:4_187:}

红影 发表于 2023-9-1 13:10

亦是金 发表于 2023-9-1 10:15
问好红影！

问好亦是金老师，下午好{:4_187:}

亦是金 发表于 2023-9-1 15:35

红影 发表于 2023-9-1 13:10
问好亦是金老师，下午好

下午好{:4_187:}

红影 发表于 2023-9-1 16:22

亦是金 发表于 2023-9-1 15:35
下午好

这些帖子里的视频选起来也挺不容易的呢。

查看完整版本: 《流淌的歌声 20CD》（CD11-CD15）选听