《再次拥有》- 千百惠
<style>
.bgDiv {
margin: auto; width: 760px; height: 500px;
background-color: #050505;
background-image:
radial-gradient( white, rgba(255, 255, 255, 0.2) 2px, transparent 40px),
radial-gradient(white, rgba(255, 255, 255, 0.15) 1px, transparent 30px),
radial-gradient(white, rgba(255, 255, 255, 0.1) 2px, transparent 40px),
radial-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.1) 2px, transparent 30px);
background-size: 580px 600px, 400px 400px, 300px 300px;
background-position: 0 0, 40px 60px, 130px 270px;
position: relative; box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.5);
animation: dark 10s linear infinite alternate;
}
.bgDiv img { position: absolute; width: 300px; height: 275px; right: 20px; bottom: 20px; opacity: .7; }
.ball {
width: 80px; height: 80px; left: 100px; top: 100px;
background: olive linear-gradient(135deg,rgba(0,250,0,.85),rgba(30,250,60,.95));
position: relative; border-radius: 50%;
filter: drop-shadow(2px 2px 6px rgba(0,0,0,.7));
transform: skew(2deg); cursor: pointer;
}
.ball::before, .ball::after { content: ''; position: absolute; }
.ball::before {
left: 0; top: 0; width: 100%; height: 100%; border-radius: 50%;
background: radial-gradient(circle at 35% 40%,rgba(255,255,255,.75),rgba(0,0,0,.15));
}
.ball::after {
left: -30px; top: -30px; right: -30px; bottom: -30px;border: 10px solid #ccc;
border-radius: 20%; transform: rotate(45deg); opacity: .45;
}
.ball div {
position: absolute; border: 10px solid rgba(0,0,0,.45); border-radius: 50%;
border-color: green lightgreen green darkgreen;opacity: .55;
}
.ball div:nth-child(1) { left: -10px; top: -10px; right: -10px; bottom: -10px; animation: rot 4s linear infinite;}
.ball div:nth-child(2) { left: -20px; top: -20px; right: -20px; bottom: -20px;animation: rot 12s linear infinite; }
@keyframes rot { to { transform: rotate(1turn); } }
@keyframes dark { to { opacity: 0.8; } }
</style>
<div class="bgDiv">
<div class="ball">
<div></div>
<div></div>
</div>
<img src="https://pic.imgdb.cn/item/629037760947543129415a25.jpg" alt="" />
</div>
<script>
let flag = true;
let ball = document.querySelector(".ball");
let au = document.createElement("audio");
au.src = "http://www.kumeiwp.com/sub/filestores/2022/05/25/a159f4eb3ce336eb3c6b30c346a1d384.mp3";
au.autoplay = flag;
au.loop= true;
au.style.display = "none"
ball.appendChild(au);
ball.onclick = function(){
if(flag) {
Array.from(this.children).forEach(function(item){item.style.animationPlayState = "paused"; });
au.pause();
flag = false;
} else {
Array.from(this.children).forEach(function(item){item.style.animationPlayState = "running"; });
au.play();
flag = true;
}
}
</script>
再次拥有 - 千百惠 (Pai Hui)
词：史俊鹏
曲：史俊鹏
女：
以为从此不会再有
流泪的夜晚
却无法释怀
曾经你是执着的开始
我以为从此不会再有
思念的捆绑
却无法逃避
心底深处的呼唤
以为从此不会再有
思念的夜晚
却一次又一次
从梦中惊醒
我以为心中不会再有
你的影子
却无法逃避
内心的呼唤
让我们再次拥有
男：
再次拥有
女：
那浓烈的开始
别让那泪水流进心窝
男：
泪水流进心窝
女：
让我们再次拥抱
合：
那心灵的呼唤
让我们再次拥有
女：
以为从此不会再有
思念的夜晚
却一次又一次
从梦中惊醒
我以为心中不会再有
你的影子
却无法逃避
内心的呼唤
让我们再次拥有
男：
再次拥有
女：
那浓烈的开始
别让那泪水流进心窝
男：
泪水流进心窝
女：
让我们再次拥抱
合：
那心灵的呼唤
让我们再次拥有
女：
让我们再次拥有
男：
再次拥有
女：
那浓烈的开始
别让那泪水流进心窝
男：
泪水流进心窝
女：
让我们再次拥抱
合：
那心灵的呼唤
让我们再次拥有
男女对唱
马黑黑 发表于 2022-5-27 12:09
男女对唱
是啊。好听吧。老黑中午好！{:4_191:} 自己再来听一次 你这个播放器设计得很完美 梦油 发表于 2022-5-27 13:21
你这个播放器设计得很完美
都是老黑教的。你喜欢就好！ 千百惠唱的最好的就是咖啡屋。。。{:5_112:} 东篱闲人 发表于 2022-5-27 13:23
千百惠唱的最好的就是咖啡屋。。。
嗯嗯，明白的。老兄去制作一个出来让我们欣赏好不好？ 加林森 发表于 2022-5-27 13:27
嗯嗯，明白的。老兄去制作一个出来让我们欣赏好不好？
好，等俺去做完核酸。。。 东篱闲人 发表于 2022-5-27 13:27
好，等俺去做完核酸。。。
好的。谢谢啦。辛苦了！ 加林森 发表于 2022-5-27 13:23
都是老黑教的。你喜欢就好！
挺好的。老黑真有两下子。 加林森 发表于 2022-5-27 13:30
好的。谢谢啦。辛苦了！
为了上级领导和商人能挣到钱。。。。{:5_112:} 梦油 发表于 2022-5-27 13:31
挺好的。老黑真有两下子。
肯定的啊。 东篱闲人 发表于 2022-5-27 13:32
为了上级领导和商人能挣到钱。。。。
啊？啥意思啊？{:5_115:} 加林森 发表于 2022-5-27 13:35
啊？啥意思啊？
佛说：不可说。{:5_161:} 东篱闲人 发表于 2022-5-27 13:49
佛说：不可说。
皮痒啦。。。。。 加林森 发表于 2022-5-27 14:22
皮痒啦。。。。。
你要皮炎平吗？{:5_115:} 东篱闲人 发表于 2022-5-27 15:59
你要皮炎平吗？
是你痒了。。。。{:4_189:} 漂亮的制作，这个制作倒是不需要太大的图图呢。欣赏队长好帖{:4_187:}
页:
[1]
2