论坛 › 欢乐水吧 › 《恭喜发财》中国娃娃 送大家！

加林森 发表于 2022-1-28 17:57

《恭喜发财》中国娃娃 送大家！

<style type="text/css">
.mnBox {
      margin: 0 auto;
      padding: 35px;
      width: 660px;
      border: none;
      border-top: 6px solid #000;/* 顶部边框样式*/
      border-radius: 10px;
      background: #b3c3c3;
}
.ctBox {
      margin: 0;
      padding: 10px;
      background: #fff;
      min-height: 300px;
      border-radius: 10px;
      box-shadow: 1px 3px 2px 2px rgba(4,4,4,.6);
}

.ctBox p,img, h2,button { text-align:center; }

.picBtn {
      width: 32px;
      height: 32px;
      outline: none;
      border: none;
      border-radius: 8px;
      background: transparent url('https://pic.imgdb.cn/item/61e446952ab3f51d917b0f77.png') no-repeat;
      cursor: pointer;
      box-shadow: 1px 1px 2px 1px rgba(0,0,0,.25);
}

.picBtn:hover {
      opacity: 0.95;
      box-shadow: 1px 1px 2px 2px rgba(0,0,0,.3);
}

.picBtn:active {
      opacity: 0.8;
      box-shadow: 1px 1px 1px 0px rgba(0,0,0,.5);
}

</style>

<div class="mnBox">
      <div class="ctBox">

            <p><img style="padding-top: 30px; alt="" src="https://pic.imgdb.cn/item/61f3bd3d2ab3f51d91fe131f.jpg" /></p>

         
                <h2 style="text-align:center;">恭喜发财</h2>
                <h2 style="text-align:center;">送大家</h2>
                <pre>
          咚咚隆咚锵
          咚咚隆咚锵
          咚咚隆咚锵咚锵咚锵
          咚咚隆咚锵
          咚咚隆咚锵
          咚咚隆咚锵咚锵锵咚
          恭喜呀恭喜
          发呀发大财
          好运当头
          坏运呀永离开
          恭喜呀大家
          黄金装满袋
          眉开眼笑
          得意呀又开怀
          咚咚隆咚锵
          咚咚隆咚锵
          咚咚隆咚锵咚锵锵咚
          发了财呀
          大家忙又忙
          买了汽车又造洋房
          家家都好风光
          喝了一杯酒来一杯酒
          家家多风光
          恭喜呀恭喜
          发呀发大财
          好运当头
          坏运呀永离开
          恭喜呀大家
          万事都愉快
          从今以后 有福没悲哀
          咚咚隆咚锵
          咚咚隆咚锵
          咚咚隆咚锵咚锵咚锵
          咚咚隆咚锵
          咚咚隆咚锵
          咚咚隆咚锵咚锵锵咚
          齐唱恭喜发财
          眼看富贵一起来
                </pre>
               <p><audio id="music" src="https://www.joy127.com/url/88419.mp3" loop="loop" autoplay="autoplay" ></audio><br> </p>
         
                <p><button id="picBtn" class="picBtn"></button></p><br>
                <p>加林森2022 01 28</p><br><br>
      </div>
</div>
<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/61e446952ab3f51d917b0f77.png')") : (mu.pause(), btn.style.background="url('https://pic.imgdb.cn/item/61e561062ab3f51d9145d37c.png')");
}

mu.addEventListener("ended", function(){
      btn.style.background="url('https://pic.imgdb.cn/item/61e561062ab3f51d9145d37c.png')";
})

</script>

红影 发表于 2022-1-28 18:51

这么喜庆的帖子，最好改一下边框和按钮的颜色。很欢快的歌曲，跟大家一起庆新春{:4_187:}

加林森 发表于 2022-1-28 19:00

红影 发表于 2022-1-28 18:51
这么喜庆的帖子，最好改一下边框和按钮的颜色。很欢快的歌曲，跟大家一起庆新春

就是， 很欢快的歌曲。图片我简单做了一下就放上来。
这会我去上传几张我拍摄的照片，放活动里去。

加林森 发表于 2022-1-29 16:33

祝福大家新年快乐、恭喜發財、开开心心过大年！

查看完整版本: 《恭喜发财》中国娃娃 送大家！