论坛 › 欢乐水吧 › 《醉红颜(DJ散人版)》 -- 冷漠

加林森 发表于 2022-3-29 18:00

《醉红颜(DJ散人版)》 -- 冷漠

<style type="text/css">
/* 帖子容器 */
#tzDiv {
      position: relative;
      left: -214px;
      width: 1024px;
      height: 600px;
      top: 80px;
      background: #eee url('https://pic.imgdb.cn/item/6242d37a27f86abb2a22eada.jpg') no-repeat center/cover;
      opacity: 0.8;
}
/* 音乐控制按钮 */
.picBtn {
      position: absolute;
       width: 100px;
       height: 100px;
       left: 180px;
       bottom: 60px;
       border: none;
       outline: none;
       border-radius: 8px;
       background: transparent url('https://pic.imgdb.cn/item/622a00ea5baa1a80ab412ada.gif') no-repeat;
       cursor: pointer;
}
/* 文本时钟 */
#textClock {
      position: absolute;
      top: 180px;
      right: 200px;
      width: 300px;
      height: 30px;
      font: 20px / 30px Sans-Serif;
      text-align: center;
}
/* 走马灯父框 */
.txtFly {
      position: absolute;
      width: 260px;
      height: 30px;
      right: 100px;
      bottom: 100px;
      overflow: hidden;
}
/* 走马灯文本 */
.txtFly div {
      position: absolute;
      left: 260px;
      font: normal 18px /20px Sans-Serif;
      word-break: keep-all;
      white-space:nowrap;
}
/* 变色文本 */
.txtBg {
      position: absolute;
      top: 80px;
      right: 100px;
      font-size: 4rem;
      color: transparent;
      width: 500px;
      height: 100px;
      line-height: 100px;
      text-align: center;
      background-image: linear-gradient(90deg, green, olive, transparent, tomato, green);
      background-size: 500px 100px;
      background-position: 500px 0;
      border: 1px solid;
      background-clip: text;
      -webkit-background-clip: text;
      animation: chgc 2s linear infinite;
}
/* 文本变色动画 */
@keyframes chgc {
      from { background-position: -500px 0; }
      to { background-position: 0 0; }
}
</style>

<div id="tzDiv">
      <div class="txtBg">醉红颜(DJ散人版)</div>
      <div id="textClock"></div>
      <div class="txtFly">
                <div id="ziFly">醉红颜(DJ散人版) - 冷漠 爱亦难别亦难忘记太难
回忆总在夜里放肆纠缠
在这深夜里辗转难眠
一切仿佛就在昨天
爱难断愁难断恨了不断
前尘往事如云烟弥漫
深深埋下那段未尽的情缘
一杯祝酒醉红颜。。。。。。</div>
      </div>
      <button id="picBtn" class="picBtn"></button>
      <audio id="music" src="http://www.kumeiwp.com/sub/filestores/2022/03/29/1a18a228d799015d6256e8be452a56dc.mp3" loop="loop" autoplay="autoplay" ></audio>
</div>

<script language="javascript">

fly(); //运行走马灯
showTime(); //显示时间
setInterval(showTime, 1000); //运行时钟

//文本时钟函数
function showTime(){
      var now = new Date();
      var year = now.getFullYear();
      var month = now.getMonth() + 1;
      var date = now.getDate();
      var day = now.getDay();
      var hour = now.getHours();
      if(hour < 10) hour = "0" + hour;
      var minute = now.getMinutes();
      if(minute < 10) minute = "0" + minute;
      var second = now.getSeconds();
      if(second < 10) second = "0" + second;
      document.getElementById("textClock").innerHTML = year + "年" + month + "月" + date + "日 星期" + toHz(day) + "" + hour + ":" + minute + ":" + second;
}
function toHz(num) { var hz = "日一二三四五六九"; return(hz.charAt(num)); }
//音乐控制代码
var mu = document.getElementById('music');
var btn = document.getElementById('picBtn');

btn.onclick = function(){
      mu.paused ? (mu.play(), btn.style.background="url('https://pic.imgdb.cn/item/622a00ea5baa1a80ab412ada.gif')") : (mu.pause(), btn.style.background="url('https://pic.imgdb.cn/item/622a01115baa1a80ab414665.png')");
}

mu.addEventListener("ended", function(){
      btn.style.background="url('https://pic.imgdb.cn/item/622a01115baa1a80ab414665.png')";
});
//创建走马灯
function fly() {
      var ziFly = document.getElementById('ziFly');
      var width = ziFly.clientWidth;
      var style = document.createElement('style');
      style.type = 'text/css';
      var flyStr = '@keyframes fly {to { left: -' + width + 'px; } }';
      style.innerHTML = flyStr;
      ziFly.appendChild(style);
      ziFly.style.animation = 'fly 40s linear infinite';
}
</script>

加林森 发表于 2022-3-29 18:02

醉红颜(DJ散人版) --冷漠
爱亦难别亦难忘记太难
回忆总在夜里放肆纠缠
在这深夜里辗转难眠
一切仿佛就在昨天
爱难断愁难断恨了不断
前尘往事如云烟弥漫
深深埋下那段未尽的情缘
一杯祝酒醉红颜
我无法忘记你动情的双眼
总似梦似醒若隐若现
等待花开花谢岁月的变迁
我对你的爱从不曾改变
狼牙月上弦寄去我的思念
轻叹世间情深缘浅
曾经永恒誓言犹如风中花瓣
渐渐飘远
爱亦难别亦难忘记太难
回忆总在夜里放肆纠缠
在这深夜里辗转难眠
一切仿佛就在昨天
爱难断愁难断恨了不断
前尘往事如云烟弥漫
深深埋下那段未尽的情缘
一杯祝酒醉红颜
我无法忘记你动情的双眼
总似梦似醒若隐若现
等待花开花谢岁月的变迁
我对你的爱从不曾改变
狼牙月上弦寄去我的思念
轻叹世间情深缘浅
曾经永恒誓言犹如风中花瓣
渐渐飘远
爱亦难别亦难忘记太难
回忆总在夜里放肆纠缠
在这深夜里辗转难眠
一切仿佛就在昨天
爱难断愁难断恨了不断
前尘往事如云烟弥漫
深深埋下那段未尽的情缘
一杯祝酒醉红颜
爱亦难别亦难忘记太难
回忆总在夜里放肆纠缠
在这深夜里辗转难眠
一切仿佛就在昨天
爱难断愁难断恨了不断
前尘往事如云烟弥漫
深深埋下那段未尽的情缘
一杯祝酒醉红颜

马黑黑 发表于 2022-3-29 18:17

DJ不错，帖子精美

加林森 发表于 2022-3-29 18:18

马黑黑 发表于 2022-3-29 18:17
DJ不错，帖子精美

谢谢老黑支持！{:4_190:}
开始吃晚饭没有啊？

马黑黑 发表于 2022-3-29 18:23

加林森 发表于 2022-3-29 18:18
谢谢老黑支持！
开始吃晚饭没有啊？

快了

加林森 发表于 2022-3-29 18:28

马黑黑 发表于 2022-3-29 18:23
快了

我已经吃完了。

红影 发表于 2022-3-29 18:52

好听的动感歌曲，欣赏队长好制作{:4_187:}

加林森 发表于 2022-3-29 19:13

红影 发表于 2022-3-29 18:52
好听的动感歌曲，欣赏队长好制作

红影晚上好。{:4_187:}
你看像不像你啊？{:4_170:}

千羽 发表于 2022-3-29 20:10

很漂亮的紫色调{:4_181:}

千羽 发表于 2022-3-29 20:12

队长的帖子越做越精彩了{:4_187:}

红影 发表于 2022-3-29 20:19

加林森 发表于 2022-3-29 19:13
红影晚上好。
你看像不像你啊？

不像，我比她静多了，老老实实呆在家里，从不乱跑{:4_173:}

马黑黑 发表于 2022-3-29 20:56

加林森 发表于 2022-3-29 18:28
我已经吃完了。

{:4_190:}

加林森 发表于 2022-3-29 21:00

千羽 发表于 2022-3-29 20:10
很漂亮的紫色调

千羽晚上好。{:4_204:}

加林森 发表于 2022-3-29 21:01

千羽 发表于 2022-3-29 20:12
队长的帖子越做越精彩了

哈哈，换着花样玩。{:4_204:}

加林森 发表于 2022-3-29 21:02

红影 发表于 2022-3-29 20:19
不像，我比她静多了，老老实实呆在家里，从不乱跑

哈哈，不跑不等于就这样的啊。{:4_189:}

加林森 发表于 2022-3-29 21:02

马黑黑 发表于 2022-3-29 20:56


谢谢老黑！

红影 发表于 2022-3-29 23:15

加林森 发表于 2022-3-29 21:02
哈哈，不跑不等于就这样的啊。

一看着图像就很活泼，没有我静{:4_173:}

加林森 发表于 2022-3-29 23:33

红影 发表于 2022-3-29 23:15
一看着图像就很活泼，没有我静

{:4_172:}跑江湖的肯定不一样啊。

红影 发表于 2022-3-30 09:46

加林森 发表于 2022-3-29 23:33
跑江湖的肯定不一样啊。

是啊，所以么，跟我肯定不像的{:4_173:}

加林森 发表于 2022-3-30 12:45

红影 发表于 2022-3-30 09:46
是啊，所以么，跟我肯定不像的

都有个面纱的。{:4_189:}

查看完整版本: 《醉红颜(DJ散人版)》 -- 冷漠