一支难忘的歌 TO: 东篱大哥
<style type="text/css">
/* 外框盒子 */
#xq { position: relative; left:-395px; top:50px; width: 1376px; height: 831px; background:#333 url('/data/attachment/forum/202203/20/172651y0wabmabg4l4mgl0.jpg') no-repeat center/cover; box-shadow: 4px 4px 5px #888;border-radius:12px; }
body { overflow-x: hidden; } /*禁用横向滚动条 */
#baiBox {
margin: auto;
width: 360px;
text-align: center;
font-size: 5rem;
font-weight: bold;
color: #EEEE00;
transform-origin: top;
animation: yao 0.8s linear infinite alternate;
}
/* 动画 */
@keyframes yao {
from{ transform: perspective(800px) rotatex(30deg); }
to { transform: perspective(800px) rotatex(-30deg); }
}
/* 播放按钮 */
.picBtn {
width: 0px;
height: 0px;
border: none;
outline: none;
border-radius: 0px;
background: transparent url('https://pic.imgdb.cn/item/622db6215baa1a80ab3dff55.gif') no-repeat;
cursor: pointer;
}
</style>
<div id="xq" >
<div id="baiBox" style="position: absolute; left:120px; top: 40px; "></div>
<div style="position: absolute; left:800px; top: 150px; width:400px;text-align:center;">
<img alt="" src="http://image.hnol.net/c/2021-01/10/10/202101101019478794-5088534.gif"/>
<div style="position:absolute; width:260px; left:560px; top: 10px; text-align:center;padding:10px;font-size:1em;font-family:'微软雅黑';text-shadow:1px 1px 2px #000;">
<marquee scrollamount="5" direction="left" > </marquee>
</div>
</div>
<!-- 控制按钮应是父盒子的第一代子元素 -->
<div style="position:absolute; width:120px; left: 10px; top:calc(100% - 140px); text-align:center;">
<button id="picBtn" class="picBtn"></button>
</div>
</div>
<!-- 播放器不要界面，无需放在帖子父盒子内 -->
<audio id="music" autoplay="autoplay" loop="loop" src="http://music.163.com/song/media/outer/url?id=234035.mp3" ></audio>
<script language="javascript">
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/622db6215baa1a80ab3dff55.gif')") : (mu.pause(), btn.style.background="url('https://pic.imgdb.cn/item/622db73d5baa1a80ab3e783b.gif')");
}
mu.addEventListener("ended", function(){
btn.style.background="url('https://pic.imgdb.cn/item/622db73d5baa1a80ab3e783b.gif')";
});
</script>
</script>
</script>
</script>
</script>
</script>
</script>
</script>
@东篱闲人 {:4_190:} 小九好制作，这个大图真漂亮。歌曲是关牧村唱的，真好听。{:4_199:} 本帖最后由 东篱闲人 于 2022-3-20 18:01 编辑
这背景，这头型衣着，还有这支老歌，都曾经是俺熟悉的场景，九儿的一幅作品，把俺的思维拉到了岁月的深处，深陷其中，久久不能回过神来。。。{:4_190:} 时光一去永不回，往事只能回味。。。。。{:4_203:} 谢谢九儿，此情此景，醉了。。。。。{:4_204:} 仿佛年轻了70岁。。。。。{:5_112:} 小九现在人物融合挺好的，很美的图和排字{:4_199:} 东篱闲人 发表于 2022-3-20 17:56
这背景，这头型衣着，还有这支老歌，都曾经是俺熟悉的场景，九儿的一幅作品，把俺的思维拉到了岁月的深处， ...
小九这制作真漂亮，赞！把老头看得深陷其中，回忆满满。。。
哈哈{:4_170:}第一次看见老头回复这么多字，看来是真的想起诗歌里的小芳了，估计老头现在在看月亮。。
{:5_106:}{:4_204:}{:4_199:}
哎呀，这是俺家的梯田，小九你咋送东篱大哥哥了 东篱闲人 发表于 2022-3-20 17:56
时光一去永不回，往事只能回味。。。。。
无情岁月增中减，有味青春苦中甜。是不是想起和小芳躲猫猫的日子啊{:4_189:} 东篱闲人 发表于 2022-3-20 18:01
仿佛年轻了70岁。。。。。
{:4_170:}{:4_179:} 东篱闲人 发表于 2022-3-20 17:56
这背景，这头型衣着，还有这支老歌，都曾经是俺熟悉的场景，九儿的一幅作品，把俺的思维拉到了岁月的深处， ...
老头开心就好，小九水平有限呢，得继续努力学习{:4_190:} 马黑黑 发表于 2022-3-20 20:36
哎呀，这是俺家的梯田，小九你咋送东篱大哥哥了
你家也有梯田么，等着，我回头再做一个{:4_187:} 千羽 发表于 2022-3-20 20:35
小九现在人物融合挺好的，很美的图和排字
谢谢羽儿鼓励，排字还得练习呢{:4_187:} 大猫咪 发表于 2022-3-20 20:36
小九这制作真漂亮，赞！把老头看得深陷其中，回忆满满。。。
哈哈第一次看见老头回复这 ...
谢谢猫咪鼓励！{:4_187:} 加林森 发表于 2022-3-20 17:48
小九好制作，这个大图真漂亮。歌曲是关牧村唱的，真好听。
谢谢队长鼓励！快去收礼{:4_190:} 小九 发表于 2022-3-20 20:52
谢谢队长鼓励！快去收礼
谢谢小九，看见啦，好漂亮的。{:4_204:} 小九 发表于 2022-3-20 20:51
谢谢猫咪鼓励！
小九晚上好 {:4_187:}一下爆发了，好帖不断 {:4_204:} 东篱闲人 发表于 2022-3-20 18:01
仿佛年轻了70岁。。。。。
太好了，请继续保持活力，永远年轻{:4_187:}