1

src/App.vue

@@ -11,7 +11,7 @@
       :loop="barrageLoop"
       >
     </vue-baberrage>
-    <!-- <div style="position: absolute;left: 0;top: 0;padding: 2%;background-color: red;z-index: 10086;" @click="sendMsg()">sendMsg</div> -->
+    <div style="position: absolute;left: 0;top: 0;padding: 2%;background-color: red;z-index: 10086;" @click="sendMsg()">sendMsg</div>
     <!-- style="position: absolute; top: 20%;z-index: 20199"  -->
     <audio style="position: absolute; top: -20%;z-index: -1"  ref="homeAudio" :loop="AudioPlayType ? true : false"  :src="url" controls></audio>
   </div>

src/assets/css/bierede.css

@@ -811,4 +811,216 @@
         transform: translate(-2800px, 0px);
         transition: all 0.6s;
     }
+}
+.dalaoshu .hd-game-btn-container{
+    position: absolute;
+    bottom: 5px;
+    right: .5%;
+    z-index: 1000;
+    width: 160px;
+    height: 80px;
+    border-radius: 8px;
+    background: url(../../../static/image/shuqian/g_footer_bg2.png) no-repeat;
+    background-size: 100% 100%;
+    display: flex;
+    text-align: center;
+    justify-content: center;
+    align-items: center;
+}
+.dalaoshu .hd-game-btn-container .hd-game-btn {
+    min-width: 70px;
+    max-width: 100px;
+    width: 100px;
+    height: 62px;
+    border-radius: .3em;
+    background: rgba(17,17,17,.6) url(../../../static/image/shuqian/g_game_btn_bg2.png) left no-repeat;
+    text-align: center;
+    cursor: pointer;
+    color: #f4d4b0;
+    cursor: pointer;
+    display: flex;
+    margin: 0 5px;
+    justify-content: center;
+    align-items: center;
+    flex-flow: column nowrap;
+}
+.dalaoshu .hd-game-btn-container .icon-go {
+    background: url(../../../static/image/shuqian/img-begin.png?1) no-repeat;
+    background-size: cover;
+    width: 22px;
+    height: 22px;
+}
+.dalaoshu .hd-game-btn-container .hd-game-btn span{
+  font-size:1.3rem;
+}
+.dalaoshu .hd-game-btn-container .hd-game-btn:nth-child(2){
+  margin-left:0;
+}
+.dalaoshu .hd-game-btn-container .icon-lajitong {
+    background: url(../../../static/image/shuqian/icon-reset2.png) no-repeat;
+    background-size: cover;
+    width: 20px;
+    height: 22px;
+}
+.dalaoshu .Number_prompt{
+    width: 100%;
+    height: 310px;
+    background: url(../../../static/image/shuqian/Number_prompt6.png) no-repeat center;
+    background-size: contain;
+    position: absolute;
+    z-index: 700;
+    top: 35%;
+}
+.dalaoshu .Number_prompt_div{
+  margin-top:120px;
+  text-align: center;
+}
+.dalaoshu .Numberpro_number{
+  font-size: 38px;
+  position: relative;
+  padding-left: 155px;
+  padding-right: 45px;
+  text-shadow: 4px 2px 6px #000;
+  color: #ffd24d;
+}
+.dalaoshu .Numberpro_left{
+  position: absolute;
+  left: 0;
+  top: 0;
+  font-size: 28px;
+  color: #ffe599;
+  line-height: 45px;
+  width: 145px;
+  height: 52px;
+}
+
+.dalaoshu .Numberpro_number .game_join_total {
+    color: #ffff73;
+    text-shadow: 0 0 35px #d15c16, 0 0 40px #dc5e0b, 0 0 50px #9d430e, 0 0 75px #ba4b0d;
+    font-weight: bold;
+    -webkit-text-fill-color: currentColor;
+}
+.dalaoshu .Numberpro_right {
+    position: absolute;
+    right: 0;
+    top: 0;
+    font-size: 28px;
+    color: #ffe599;
+    line-height: 45px;
+    width: 31px;
+    height: 52px;
+}
+.dalaoshu .prompt_img {
+    width: 790px;
+    margin: 20px auto 0 auto;
+    position: relative;
+    height: 70px;
+}
+.dalaoshu .prompt_img span {
+    margin-left: 10px;
+    margin-right: 10px;
+    width: 70px;
+    height: 70px;
+    display: inline-block;
+    background-size: cover;
+    background-image: url(../../../static/image/shuqian/lotter_win_bg.png);
+    text-align: center;
+    line-height: 70px;
+    /* position: absolute; */
+}
+.dalaoshu .prompt_img span img {
+    width: 60px;
+    height: 60px;
+    border-radius: 50%;
+    margin-top: 5px;
+}
+.shu-start-tooltip-box {
+    text-align: center;
+    position: fixed;
+    top: 40%;
+    left: 50%;
+    margin-left: -441px;
+    margin-top: -200px;
+    z-index: 99;
+    background: url(../../../static/image/shuqian/g_game_cd_bg5.png) no-repeat;
+    background-size: cover;
+    width: 883px;
+    height: 392px;
+}
+.shu-num-box {
+    font-size: 150px;
+    line-height: 150px;
+    height: 150px;
+    font-family: "Arial",cursive;
+    color: #ffff73;
+    text-shadow: 0 0 35px #d15c16, 0 0 40px #dc5e0b, 0 0 50px #9d430e, 0 0 75px #ba4b0d;
+    font-weight: bold;
+    -webkit-text-fill-color: currentColor;
+    animation: dTime 1s infinite ease;
+    transform: scale(2,2);
+    margin-top:175px;
+}
+@keyframes dTime {
+    1% {
+        transform: scale(2);
+        opacity: 1
+    }
+    90% {
+        transform: scale(1);
+        opacity: 0
+    }
+    100% {
+        transform: scale(2);
+        opacity: 0
+    }
+}
+.number-ani-box {
+    padding: 107px 50px 0 40px;
+    text-align: center;
+    width: 422px;
+    height: 422px;
+    position: fixed;
+    top: 33%;
+    left: 48%;
+    margin-left: -205px;
+    margin-top: -180px;
+    z-index: 100;
+    /* display: none; */
+    border-radius: 50%;
+    animation: numberAni 1s infinite ease;
+    background: url(../../../static/image/shuqian/number-ani-boxBs.png);
+    background-size: 100% 100%
+}
+
+.dalaoshu .number-ani-box .imgNumberImg {
+    position: absolute;
+    left: 100px;
+    top: 175px;
+    width: 178px
+}
+
+.dalaoshu .number-ani-box .imgNumberImg2 {
+    position: absolute;
+    right: 110px;
+    top: 175px;
+    width: 178px
+}
+
+@keyframes numberAni {
+    1% {
+        transform: scale(3);
+        opacity: 1
+    }
+    90% {
+        transform: scale(1);
+        opacity: 0
+    }
+    100% {
+        transform: scale(3);
+        opacity: 0
+    }
+}
+
+.number-ani-box img {
+    margin-left: 8px
 }
\ No newline at end of file