Skip to content

N
NEWYEARPARTY
Commit 60102a97 authored by 华国豪's avatar 华国豪 🙄
Browse files
Options

图片之类的

parent 1befc842
Show whitespace changes
Inline Side-by-side
Showing with 1208 additions and 8 deletions
package.json
View file @ 60102a97
......@@ -16,12 +16,13 @@
"dependencies": {
"@aspnet/signalr": "^1.1.4",
"element-ui": "^2.13.0",
"signalr": "^2.4.1",
"socket.io-client": "^2.2.0",
"three": "^0.111.0",
"vue": "^2.5.2",
"vue-baberrage": "^2.1.9",
"vue-router": "^3.0.1",
"vue-socket.io": "^3.0.4",
"signalr": "^2.4.1"
"vue-socket.io": "^3.0.4"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
......@@ -59,6 +60,7 @@
"html-webpack-plugin": "^2.30.1",
"jest": "^22.0.4",
"jest-serializer-vue": "^0.3.0",
"jquery": "^3.4.1",
"nightwatch": "^0.9.12",
"node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0",
......@@ -90,5 +92,12 @@
"> 1%",
"last 2 versions",
"not ie <= 8"
]
],
"eslintConfig": {
"root": true,
"env": {
"node": true,
"jquery": true
}
}
}
src/App.vue
View file @ 60102a97
......@@ -11,9 +11,9 @@
: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 ref="homeAudio" :loop="AudioPlayType ? true : false" :src="url" controls></audio>
<audio style="position: absolute; top: -20%;z-index: -1" ref="homeAudio" :loop="AudioPlayType ? true : false" :src="url" controls></audio>
</div>
</template>
......@@ -105,7 +105,7 @@ export default {
},
sendMsg () {
var $this = this;
$this.proxy.invoke("SendBarrage", '我擦很社会啊').done(msg => {
$this.proxy.invoke("SendBarrage", '0.0 让我康康是谁在说我坏话？').done(msg => {
console.log(msg)
});
},
......
src/assets/css/bierede.css 0 → 100644
View file @ 60102a97
.box-size {
width: 100%;
height: 100%
}
.container {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0
}
.container .bg_01 {
width: 3000px;
height: 454px;
z-index: 0;
background-repeat: repeat-x;
background-position: top left;
top: 0;
left: 0;
position: absolute
}
.container .bg-ani-box {
top: 0;
left: 0;
position: absolute;
z-index: 2
}
.container .top-cloud {
width: 3000px;
height: 454px;
z-index: 1;
background-repeat: repeat-x;
background-position: left;
top: 0;
left: 0;
position: absolute
}
.container .bg {
width: 100%;
height: 100%;
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2
}
.container .screen {
width: 100%;
height: 100%;
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2
}
.container .screen .screen_left {
width: 23%;
height: 23%;
background-size: 100% 100%;
background-image: url(/static/image/dalaoshu/screen_left.png);
position: absolute;
top: 0;
left: 0;
z-index: 2
}
.container .screen .screen_right {
width: 19%;
height: 25%;
background-size: 100% 100%;
background-image: url(/static/image/dalaoshu/screen_right.png);
position: absolute;
top: 0;
right: 0;
z-index: 2
}
.container .logo-box {
z-index: 50;
position: absolute;
width: 100%;
text-align: center;
top: 9%
}
.container .logo-box img {
width: auto;
height: auto;
max-height: 200px
}
.container .bottom_cloud {
position: absolute;
bottom: 0;
left: 0;
width: 3000px;
height: 300px;
z-index: 10;
background-repeat: repeat-x;
background-position: bottom left
}
.container .countdown {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 5
}
.container .countdown .countdown_left,.container .countdown .countdown_right {
width: 80px;
height: 540px;
position: fixed;
z-index: 3;
display: flex
}
.container .countdown .countdown_left {
top: 20%;
left: 5%
}
.container .countdown .countdown_right {
top: 20%;
right: 5%
}
.container .countdown .countdown_left .axis,.container .countdown .countdown_right .axis {
position: absolute;
top: 0;
left: 28%;
width: 36px;
height: 486px;
border-radius: 20px;
border: 5px solid #fe5a1a;
background: linear-gradient(#f9df61,#ff960b);
z-index: 3;
flex-direction: row
}
.container .countdown .countdown_left .axis .user,.container .countdown .countdown_right .axis .user {
margin-top: 150%;
width: 100%;
position: relative;
top: 0;
left: 0
}
.container .countdown .countdown_right .axis .user .head_img {
position: relative;
top: 8px;
left: -36px
}
.container .countdown .countdown_left .axis .user .avatar,.container .countdown .countdown_right .axis .user .avatar {
position: absolute;
width: 45px;
height: 45px;
color: #ffff93;
background-size: 100% 100%;
background: url(/static/image/dalaoshu/avatar.png) no-repeat center/cover
}
.container .countdown .countdown_left .axis .user .avatar {
top: -4%;
left: -14px
}
.container .countdown .countdown_right .axis .user .avatar {
top: 15%;
right: -10px
}
.container .countdown .countdown_left .axis .user .avatar img,.container .countdown .countdown_right .axis .user .avatar img {
width: 60%
}
.container .countdown .countdown_left .axis .user .avatar .ranking,.container .countdown .countdown_right .axis .user .avatar .ranking {
background-image: -webkit-linear-gradient(bottom,#530600,#732000,#9b4500);
-webkit-background-clip: text;
-webkit-text-fill-color: rgba(155,69,0,0.7);
font-weight: bold;
position: absolute
}
.container .countdown .countdown_left .axis .user .avatar .ranking {
top: 3px;
left: 0
}
.container .countdown .countdown_right .axis .user .avatar .ranking {
top: 3px;
left: 39px
}
.container .countdown .countdown_right .axis .user:nth-of-type(5) .avatar .ranking {
left: 35px
}
.container .countdown .countdown_left .axis .user .texts,.container .countdown .countdown_right .axis .user .texts {
-webkit-text-stroke: 1px #852d0b;
width: 400%;
font-weight: bold;
position: absolute;
font-weight: bold;
font-size: 24px
}
.container .countdown .countdown_left .axis .user .texts {
top: 0;
left: 40px
}
.container .countdown .countdown_right .axis .user .texts {
top: 15%;
left: -120px
}
.container .countdown .countdown_left .axis .user .texts .name,.container .countdown .countdown_right .axis .user .texts .name {
-webkit-text-fill-color: #ff9
}
.container .countdown .countdown_right .axis .user .texts .name {
float: right
}
.container .countdown .countdown_left .axis .user .texts .score,.container .countdown .countdown_right .axis .user .texts .score {
-webkit-text-fill-color: #f9df61
}
.container .countdown .countdown_right .axis .user .texts .score {
left: 15px
}
.container .countdown .countdown_left .axis .user img,.container .countdown .countdown_right .axis .user img {
width: 150%;
border-radius: 50%
}
.container .countdown .countdown_left .axis .user img {
margin-left: -10px
}
.container .countdown .countdown_right .axis .user img {
margin-left: 30px
}
.container .countdown .countdown_right .axis .user .head_img {
margin: 0;
position: relative;
top: 9px;
left: -6px
}
.container .countdown .countdown_left .time,.container .countdown .countdown_right .time {
width: 80px;
height: 80px;
align-self: flex-end;
border-radius: 50%;
background-color: #fe5a1a;
text-align: center;
color: #bb3307;
font-weight: 700;
z-index: 2
}
.container .countdown .countdown_left .text,.container .countdown .countdown_right .text {
width: 64px;
height: 64px;
background-color: #fff;
border-radius: 50%;
background: linear-gradient(#f9df60,#ff8d0a);
background-color: #fe5a1a;
text-align: center;
color: #bb3307;
font-weight: 700;
z-index: 50;
position: absolute;
bottom: 1.5%;
left: 9%
}
.container .countdown .countdown_left .text p,.container .countdown .countdown_right .text p {
padding-top: 10px;
font-size: 14px
}
.container .countdown .countdown_left .text h1,.container .countdown .countdown_right .text h1 {
font-size: 35px;
margin-top: -9px;
text-shadow: 0 0 5px #ff9600,0 0 10px #ff9600,0 0 15px #ff9600
}
.num-scale-bg {
animation: mymovebg 1s infinite;
-webkit-animation: mymovebg 1s infinite;
animation-direction: alternate;
animation-timing-function: ease-in-out;
-webkit-animation-direction: alternate;
-webkit-animation-timing-function: ease-in-out
}
@keyframes mymovebg {
0% {
transform: scale(1)
}
50% {
transform: scale(1.5)
}
100% {
transform: scale(1)
}
}
@-webkit-keyframes mymovebg {
0% {
transform: scale(1)
}
50% {
transform: scale(1.5)
}
100% {
transform: scale(1)
}
}
.container .hole-container {
position: absolute;
bottom: 18%;
left: 20%;
width: 60%;
height: 38%;
z-index: 5
}
.container .hole-container .hole {
position: absolute;
background: url(/static/image/dalaoshu/groundHole_01.png) no-repeat center/cover;
width: 160px;
height: 53px
}
.container .hole-container .hole .mouse {
position: absolute;
overflow: hidden;
border-radius: 32%;
height: 117px;
width: 153px;
top: -86px;
left: 4px
}
.container .hole-container .hole .mouse img {
position: absolute;
width: 100%;
top: 118px;
left: 0
}
.container>.score {
width: 70%;
height: 6%;
position: absolute;
bottom: 13%;
left: 0;
z-index: 50;
border-radius: 15px;
display: flex
}
.container>.score .avatar {
flex: .5;
text-align: center
}
.container>.score .avatar img {
width: 50%;
margin-top: 7px
}
.container>.score .text {
flex: 1.4;
line-height: 64px;
font-size: 26px;
color: #fcdd4f;
margin-left: 10px
}
.container>.score .text p {
letter-spacing: 1px
}
@media(max-width:1366px) {
.score .text p {
font-size: 14px;
line-height: 46px
}
}
@media(max-width:1440px) {
.score .text p {
font-size: 19px;
line-height: 54px
}
}
.cover-container .cover-box {
position: absolute;
z-index: 100;
top: 50%;
width: 1000px;
height: 800px;
margin-top: -400px;
left: 50%;
margin-left: -500px;
text-align: center;
overflow: hidden
}
.cover-box .star-box {
width: 353px;
height: 143px;
background: url(/static/image/dalaoshu/star.png) no-repeat;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -177px;
opacity: 0;
top: 90px;
animation: starBox .5s 1 ease-in-out .3s forwards
}
.cover-box .star-title {
background: url(/static/image/dalaoshu/title.png) no-repeat;
width: 650px;
height: 125px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -325px;
top: 176px;
opacity: 0;
animation: titleBox .5s 1 ease-in-out forwards
}
.cover-box .star-line {
background: url(/static/image/dalaoshu/line.png) no-repeat;
width: 1000px;
height: 5px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -500px;
top: 242px;
opacity: 0;
animation: building-2 1s 1 ease-in-out 2s forwards
}
.cover-container {
width: 100%;
height: 100%;
position: absolute;
z-index: 20;
background: rgba(17,17,17,0.5);
left: 0;
right: 0
}
.cover-box {
position: absolute;
z-index: 100;
top: 50%;
width: 1000px;
height: 640px;
margin-top: -20px;
left: 50%;
margin-left: -500px;
text-align: center;
overflow: hidden
}
.cover-box .star-box {
width: 353px;
height: 143px;
background: url(/static/image/dalaoshu/star.png) no-repeat;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -177px;
opacity: 0;
top: 90px;
animation: starBox .5s 1 ease-in-out .3s forwards
}
.cover-box .star-title {
background: url(/static/image/dalaoshu/title.png) no-repeat;
width: 650px;
height: 125px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -325px;
top: 176px;
opacity: 0;
animation: titleBox .5s 1 ease-in-out forwards
}
.cover-box .game-title {
width: 400px;
height: 52px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -200px;
font-size: 55px;
font-weight: bold;
top: 180px;
letter-spacing: 6px;
opacity: 0;
z-index: 0;
animation: gameBox .5s 1 ease-in-out .5s forwards;
-webkit-animation: gameBox .5s 1 ease-in-out .5s forwards;
text-shadow: 4px 3px 0 #9d2200;
color: #ff5503;
-webkit-text-stroke: 2px #581800
}
.cover-box .game-title:before {
content: attr(data-text);
position: absolute;
-webkit-text-stroke: 2px #581800;
color: #ffed95;
-webkit-mask-image: -webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,1)),color-stop(61%,rgba(0,0,0,1)),to(rgba(0,0,0,0)));
text-shadow: 0 0 2px #ffed95
}
.cover-box .star-line {
background: url(/static/image/dalaoshu/line.png) no-repeat;
width: 1000px;
height: 5px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -500px;
top: 242px;
opacity: 0;
animation: building-2 1s 1 ease-in-out 2s forwards
}
.pig-build {
background: url(/static/image/dalaoshu/z1.png) no-repeat;
width: 600px;
height: 350px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -300px;
top: 253px;
opacity: 0;
background-image: url(/static/image/dalaoshu/z1.png);
-webkit-animation-name: runman;
-webkit-animation-duration: .8s;
-webkit-animation-timing-function: ease;
-webkit-animation-delay: 1s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-fill-mode: none
}
.cover-box .ribbon-flag {
background: url(/static/image/dalaoshu/flag.png) no-repeat;
width: 579px;
height: 81px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -289px;
top: 550px;
opacity: 0;
animation: carFlag 1s 1 ease-in-out .5s forwards;
-webkit-animation: carFlag 1s 1 ease-in-out .5s forwards;
z-index: 1
}
.cover-box .ribbon-flag-title {
width: 310px;
height: 40px;
background-size: 100% 100%;
position: absolute;
left: 50%;
margin-left: -155px;
top: 561px;
opacity: 0;
animation: carFlag 1s 1 ease-in-out .5s forwards;
-webkit-animation: carFlag 1s 1 ease-in-out .5s forwards;
z-index: 1
}
@keyframes building-2 {
0% {
opacity: 0
}
100% {
opacity: 1
}
}
@keyframes starBox {
0% {
opacity: 1;
transform: scale(0.2)
}
50% {
opacity: 1;
transform: scale(1.1)
}
100% {
opacity: 1;
transform: scale(1)
}
}
@keyframes titleBox {
0% {
opacity: 1;
transform: scale(0.2)
}
50% {
opacity: 1;
transform: scale(1.1)
}
100% {
opacity: 1;
transform: scale(1)
}
}
@keyframes gameBox {
0% {
opacity: 1;
transform: scale(0.2)
}
25% {
opacity: 1;
transform: scale(1.5)
}
50% {
opacity: 1;
transform: scale(1)
}
75% {
opacity: 1;
transform: scale(1.2)
}
100% {
opacity: 1;
transform: scale(1)
}
}
@keyframes carFlag {
0% {
opacity: 0;
transform: translateY(120px)
}
33% {
opacity: 1;
transform: translateY(0)
}
66% {
opacity: 1;
transform: translateY(20px)
}
100% {
opacity: 1;
transform: translateY(0)
}
}
@-webkit-keyframes runman {
0.1% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z1.png)
}
5.3% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z2.png)
}
10.6% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z3.png)
}
15.9% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z4.png)
}
21.2% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z5.png)
}
26.5% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z6.png)
}
31.8% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z7.png)
}
37.1% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z8.png)
}
42.4% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z9.png)
}
47.7% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z10.png)
}
53% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z11.png)
}
58.3% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z12.png)
}
63.6% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z13.png)
}
68.9% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z14.png)
}
74.2% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z15.png)
}
79.5% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z16.png)
}
84.8% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z17.png)
}
90.1% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z18.png)
}
95.4% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z19.png)
}
100% {
opacity: 1;
background-image: url(/static/image/dalaoshu/z20.png)
}
}
\ No newline at end of file
src/assets/js/musicJson.js 0 → 100644
View file @ 60102a97
const musicOptions = [
{
name: '喜庆',
value: '/static/audio/bg_m_000.mp3'
},
{
name: '大气磅礴',
value: '/static/audio/bg_m_001.mp3'
},
{
name: '欢乐时光',
value: '/static/audio/bg_m_002.mp3'
},
{
name: '激昂振奋',
value: '/static/audio/bg_m_003.mp3'
},
{
name: '节奏大师',
value: '/static/audio/bg_m_004.mp3'
},
{
name: '紧张刺激',
value: '/static/audio/bg_m_005.mp3'
},
{
name: '经典配乐',
value: '/static/audio/bg_m_006.mp3'
},
{
name: '清脆动人',
value: '/static/audio/bg_m_007.mp3'
},
{
name: '游戏配乐',
value: '/static/audio/bg_m_008.mp3'
}
]
module.exports = {
musicOptions: musicOptions
}
src/components/playGame/Mouse.vue
View file @ 60102a97
<template>
<div>
<div>{{msg}}</div>
<div class="box-size container" style="">
<!-- 紫色背景遮罩层 -->
<div class="box-size bg_01" style="width: 6000px; background-image: url(/static/image/dalaoshu/zise.png); transform: translate(-884px, 0px);"></div>
<!-- 头部云 -->
<div class="top-cloud" style="width: 6000px; background-image: url(/static/image/dalaoshu/top_y.png); transform: translate(-532.5px, 0px);"></div>
<!-- 背景 -->
<div class="bg" style="background-image: url(/static/image/dalaoshu/bg_.png);"></div>
<!--动画层-->
<div class="box-size bg-ani-box" id="ani-container">
<div class="ani01"></div>
<div class="ani01 two"></div>
<div class="ani02"></div>
<div class="ani02 two"></div>
<div class="ani03"></div>
</div>
<!-- 银幕 -->
<div class="screen">
<div class="screen_left"></div>
<div class="screen_right"></div>
</div>
<!-- 底部云 -->
<div class="bottom_cloud" style="width: 6000px; background-image: url(/static/image/dalaoshu/bottom_y.png); transform: translate(-1775px, 0px);"></div>
<!-- 两边排行榜 -->
<div class="countdown">
<div class="countdown_left">
<div class="axis">
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
</div>
<div class="time"></div>
<div class="text">
<p> 倒计时 </p>
<h1>30</h1>
</div>
</div>
<div class="countdown_right">
<div class="axis">
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
<div class="user" style="display: none;">
<div class="texts">
<p class="name"></p>
<p class="score"></p>
</div>
<img class="head_img" />
<div class="avatar">
<img src="//cdn.gohudong.com/Public/Hudong/Games/Capture2019/ranking_bg.png" />
<div class="ranking"></div>
</div>
</div>
</div>
<div class="time"></div>
<div class="text">
<p> 倒计时 </p>
<h1>30</h1>
</div>
</div>
</div>
<!-- 地鼠部分 -->
<div class="hole-container">
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(200px, 0px) scale(0.7, 0.7);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7aada3.png" style="top: 118px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(400px, 0px) scale(0.7, 0.7);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7c7bb2.png" style="top: 118px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(600px, 0px) scale(0.7, 0.7);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7e904f.png" style="top: 118px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(100px, 100px) scale(1, 1);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7c7bb2.png" style="top: 118px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(400px, 100px) scale(1, 1);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7aada3.png" style="top: 0px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(700px, 100px) scale(1, 1);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7e904f.png" style="top: 118px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(0px, 250px) scale(1.3, 1.3);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7e904f.png" style="top: 118px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(400px, 250px) scale(1.3, 1.3);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6cf7aada3.png" style="top: 118px;" />
</div>
</div>
<div class="hole" style="background-image: url(/static/image/dalaoshu/laoshudong1.png); transform: translate(800px, 250px) scale(1.3, 1.3);">
<div class="mouse">
<img src="https://img.gohudong.com/2019-10-22_5dae6d015d1b5.png" style="top: 118px;" />
</div>
</div>
</div>
<!-- 得分部分 -->
<div class="score" style="display: none">
<div class="avatar">
<img />
</div>
<div class="text">
<p></p>
</div>
</div>
<div class="cover-container" style="">
<div class="winner-topBs">
<img src="//cdn.gohudong.com/Public/Hudong/Enterprise/Pc/assets/new-back-topbs.png" />
</div>
<div class="cover-box">
<!--1-->
<div class="star-box"></div>
<!--2-->
<div class="star-line"></div>
<div class="star-title"></div>
<div class="game-title" data-text="京鼠闹大年">
京鼠闹大年
</div>
<div class="pig-build"></div>
<div class="ribbon-flag"></div>
<div class="ribbon-flag-title"></div>
</div>
</div>
<div class="logo-box">
<img />
</div>
<div class="hd-game-btn-container" style="display: none;">
<div class="hd-game-btn">
<i class="iconfont icon-go"></i>
<span>准备</span>
</div>
<div class="hd-game-btn" style="display: none;">
<i class="iconfont icon-lajitong"></i>
<span>重置</span>
</div>
</div>
<div class="game-countdown-divs-bg" style="display: none;">
<div class="game-countdown-divs">
<div class="game-titles-content">
京鼠闹大年
</div>
<div class="game-titles">
京鼠闹大年
</div>
<div class="wait-time" style="opacity: 1; transform: scale(1, 1);">
<img src="//cdn.gohudong.com/Public/Hudong/Games/GameShake2019/assets/nums/go.png" />
</div>
<div class="wait-num-name"></div>
</div>
</div>
<div class="SecondRound" style="display: none;">
<div class="game_SecondRound_div">
<div class="game_SecondRound_style">
第
<span class="game_SecondRound">1</span> 轮
</div>
</div>
</div>
<div class="game-cd-time" style="opacity: 0; transform: scale(0.1, 0.1);">
<img src="//cdn.gohudong.com/Public/Hudong/Games/GameShake2019/assets/num/3.png" />
<img src="//cdn.gohudong.com/Public/Hudong/Games/GameShake2019/assets/num/0.png" />
</div>
<div class="Number_prompt-bg" style="display: none;">
<div class="Number_prompt">
<div class="game-titles-content">
京鼠闹大年
</div>
<div class="game-titles">
京鼠闹大年
</div>
<div class="Number_prompt_div">
<span class="Numberpro_number"> <span class="Numberpro_left">游戏已进入</span><span class="game_join_total">0</span><span class="Numberpro_right">人</span> </span>
</div>
<div class="prompt_imgdiv">
<div class="prompt_img"></div>
</div>
<div class="guest-num-name"></div>
</div>
</div>
<div class="game-winner" style="display: none;">
<div class="winner-topBs">
<img src="//cdn.gohudong.com/Public/Hudong/Enterprise/Pc/assets/new-back-topbs.png" />
</div>
<div class="winner-circularDiv">
<div class="winner-circular">
<img class="winnerRipple" src="//cdn.gohudong.com/Public/Hudong/Enterprise//Pc/assets/winner-quan3.png" style="transform: scale(2, 2); opacity: 0; transition: opacity 2500ms linear 0s, transform 2500ms linear 0s;" />
<img class="winnerRipple" src="//cdn.gohudong.com/Public/Hudong/Enterprise//Pc/assets/winner-quan2.png" style="transform: scale(2, 2); opacity: 0; transition: opacity 2500ms linear 0s, transform 2500ms linear 0s;" />
<img class="winnerRipple" src="//cdn.gohudong.com/Public/Hudong/Enterprise//Pc/assets/winner-quan4.png" style="transform: scale(2, 2); opacity: 0; transition: opacity 2500ms linear 0s, transform 2500ms linear 0s;" />
</div>
</div>
<div class="game-winner-bottom"></div>
<div class="winner-hua gameWinnerRibbon"></div>
<div class="winner-botHua"></div>
<div class="newgame-winners" style="transform: scale(1, 1);">
<div class="newgame-winner-box">
<div class="newgame-winner-item game-winner-top1" id="top2">
<canvas id="canvas_top2" width="200" height="200" style="position:absolute;top:-68px;left:-23px;"></canvas>
<img src="//cdn.gohudong.com/Public/Hudong/images/awardStage/new-number2.png?2" class="game-winner-img" />
<div class="gameWinner-head-bs3" style="display: block;"></div>
<div class="gn-item-head newgame-winner-ico">
<div class="gameWinner-head-bs1"></div>
<img src="//show.gohudong.com/Public/Hudong/images/gn_r4_c1.png?1" class="img-circle" width="66" height="66" />
</div>
<div class="gn-item-txt_new game-winner-txt">
<p class="newgn-widths gn-item-name">虚位以待</p>
<span class="gn-item-sc"><span class="newgn-width gn-item-number"></span></span>
</div>
</div>
<div class="newgame-winner-item game-winner-top2" id="top1">
<canvas id="canvas_top1" width="200" height="200" style="position:absolute;top:-68px;left:-23px;"></canvas>
<img src="//cdn.gohudong.com/Public/Hudong/images/awardStage/new-number1.png?2" class="game-winner-img" />
<div class="gameWinner-head-bs3" style="display: block;"></div>
<div class="gn-item-head game-winner-ico-big">
<div class="gameWinner-head-bs1"></div>
<img src="//show.gohudong.com/Public/Hudong/images/gn_r4_c1.png?1" class="img-circle" width="66" height="66" />
</div>
<div class="gn-item-txt_new2 game-winner-txtbig">
<p class="newgn-widths gn-item-name">虚位以待</p>
<span class="gn-item-sc"><span class="newgn-width gn-item-number"></span></span>
</div>
</div>
<div class="newgame-winner-item game-winner-top3" id="top3">
<canvas id="canvas_top3" width="200" height="200" style="position:absolute;top:-68px;left:-23px;"></canvas>
<img src="//cdn.gohudong.com/Public/Hudong/images/awardStage/new-number3.png?2" class="game-winner-img" />
<div class="gameWinner-head-bs3" style="display: block;"></div>
<div class="gn-item-head newgame-winner-ico">
<div class="gameWinner-head-bs1"></div>
<img src="//show.gohudong.com/Public/Hudong/images/gn_r4_c1.png?1" class="img-circle" width="66" height="66" />
</div>
<div class="gn-item-txt_new game-winner-txt">
<p class="newgn-widths gn-item-name">虚位以待</p>
<span class="gn-item-sc"><span class="newgn-width gn-item-number"></span></span>
</div>
</div>
</div>
<div class="new-listnav" style="display: none;">
<div class="new-listwidth"></div>
</div>
</div>
</div>
</div>
</div>
</template>
......@@ -13,10 +358,11 @@ export default {
}
},
activated () {
this.msg = new Date() + '呵呵'
}
}
</script>
<style>
@import "../../assets/css/bierede.css";
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment