[年会抽奖]UI细节调整

zouyang0921
1 parent 479b9711
Showing 2 changed files with 8 additions and 9 deletions
lottery.html
lottery.js
@@ -20,8 +20,8 @@
         .radio-item {display: flex;align-items: center;justify-content: space-between;cursor: pointer;}
         .radio-item:not(:last-of-type) {margin-bottom: 70px;}
         .radio-item.active .radio-icon-active {display: block;}
-        .radio-item .radio-icon {width: 48px;height: 48px;box-sizing: border-box;border: 2px solid #F9D28D;border-radius: 50%;display: flex;align-items: center;justify-content: center;}
-        .radio-item .radio-icon-active {display: none;width: 34px;height: 34px;border-radius: 50%;background: #F9D28D;}
+        .radio-item .radio-icon {position: relative;width: 48px;height: 48px;box-sizing: border-box;border: 2px solid #F9D28D;border-radius: 50%;}
+        .radio-item .radio-icon-active {display: none;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 34px;height: 34px;border-radius: 50%;background: #F9D28D;}
         .radio-item .radio-label {font-size: 68px;color: #F9D28D;}
         .enter-btn {width: 506px;height: 152px;margin-top: 156px;margin-left: 517px;background: url('./img/pc/btn_bg.png') no-repeat;background-size: 100% 100%;line-height: 152px;text-align: center;font-size: 55px;color: #FFDCC2;cursor: pointer;}
@@ -83,11 +83,11 @@
             <div class="avatar">
                 <div class="avatar-img">
                     <div class="avatar-list clearfix">
-                        <img class="avatar-item" src="./img/mobile/default_avatar.png">
+                        <img class="avatar-item" src="./img/pc/default_avatar.png">
                     </div>
                 </div>
                 <div class="winner hide">
-                    <img class="avatar-item" src="./img/mobile/default_avatar.png">
+                    <img class="avatar-item" src="./img/pc/default_avatar.png">
                 </div>
                 <div class="avatar-bg"></div>
             </div>
@@ -166,6 +166,10 @@ let action = {
     },
     continueLottery: function() {
         action.userList.splice(action.curUserIndex, 1);
+        if (action.userList.length === 0) {
+            alert('暂无数据');
+            return;
+        }
         // 初始化头像部分
         $('.avatar-img, .user-info .scroll-wrap').show();
@@ -174,11 +178,6 @@ let action = {
         $('.stop-btn').show();
         $('.continue-btn, .start-btn').hide();
-        if (action.userList.length === 0) {
-            alert('暂无数据');
-            return;
-        }
-
         // 开始抽奖动画
         imgTimer = this.lotteryAnimation($('.avatar-list'), '.avatar-item', 244);
         nameTimer = this.lotteryAnimation($('.user-name .scroll-list'), '.scroll-item', 146);