595 lines
23 KiB
HTML
595 lines
23 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>年度盛典</title>
|
||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||
<link rel="stylesheet" href="./css/index.css">
|
||
</head>
|
||
|
||
<body>
|
||
<!-- 頂部返回 -->
|
||
<div class="back">
|
||
<img src="./images/travel/back.png" alt="">
|
||
</div>
|
||
<!-- 主視覺 -->
|
||
<div class="header">
|
||
<!-- 活動規則 -->
|
||
<img src="./images/rule_icon.png" alt="" class="rule_icon">
|
||
<!-- 寶箱任務 -->
|
||
<img src="./images/toast.png" alt="" class="toast">
|
||
<!-- tab切換 -->
|
||
<div class="act tab tab1">年度摯友</div>
|
||
<div class="tab tab2">禮物代言人</div>
|
||
<div class="tab tab3">人氣主播</div>
|
||
<div class="tab tab4" style="display: none;">名廳之戰</div>
|
||
<div class="tab tab5">年度神豪</div>
|
||
</div>
|
||
|
||
<!-- 頁面1 -->
|
||
<div class="page1">
|
||
<div class="box">
|
||
<!-- 前三 -->
|
||
<div class="no1">
|
||
<img src="./images/NO1.png" alt="" class="NOIcon">
|
||
<img src="./images/NOts1.png" alt="" class="lts">
|
||
<img src="./images/NOts1.png" alt="" class="rts">
|
||
<img src="./images/logo.png" alt="" class="leftTx">
|
||
<img src="./images/logo.png" alt="" class="rightTx">
|
||
<div class="leftName">用戶昵稱</div>
|
||
<div class="right">用戶昵稱</div>
|
||
<div class="score">xxxx友誼值</div>
|
||
</div>
|
||
<div class="no2">
|
||
<img src="./images/NO2.png" alt="" class="NOIcon">
|
||
<img src="./images/NOts23.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="leftTx">
|
||
<img src="./images/logo.png" alt="" class="rightTx">
|
||
<div class="leftName">用戶昵稱</div>
|
||
<div class="right">用戶昵稱</div>
|
||
<div class="score">xxxx友誼值</div>
|
||
</div>
|
||
<div class="no3">
|
||
<img src="./images/NO3.png" alt="" class="NOIcon">
|
||
<img src="./images/NOts23.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="leftTx">
|
||
<img src="./images/logo.png" alt="" class="rightTx">
|
||
<div class="leftName">用戶昵稱</div>
|
||
<div class="right">用戶昵稱</div>
|
||
<div class="score">xxxx友誼值</div>
|
||
</div>
|
||
<!-- 非前三 -->
|
||
<ul>
|
||
<li>
|
||
<div class="num">04</div>
|
||
<img src="./images/page1notTop3ts.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="ltx">
|
||
<img src="./images/logo.png" alt="" class="rtx">
|
||
<div class="lName">用戶昵稱</div>
|
||
<div class="rName">用戶昵稱</div>
|
||
<div class="score">xxxx友誼值</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="my">
|
||
<img src="./images/pageMyicon.png" alt="" class="pageMyicon">
|
||
<div class="myBox">
|
||
<div class="myBox_in">
|
||
<img src="./images/page1notTop3ts.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="ltx">
|
||
<img src="./images/logo.png" alt="" class="rtx">
|
||
<div class="lName">用戶昵稱</div>
|
||
<div class="rName">用戶昵稱</div>
|
||
<div class="score">
|
||
<p>xxxx友誼值</p><span>當前排名xxx</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 頁面2 -->
|
||
<div class="page2">
|
||
<!-- 切換 -->
|
||
<div class="tabBox">
|
||
<div class="tab act">冰晶花</div>
|
||
<div class="tab">黎光勛章</div>
|
||
<div class="tab">榮耀權杖</div>
|
||
<div class="tab">流光綺夢</div>
|
||
<div class="tab">冰霜王座</div>
|
||
<div class="tab">神祇榮光</div>
|
||
</div>
|
||
<!-- 禮物切換展示 -->
|
||
<img src="./images/page2GiftBox.png" alt="" class="page2GiftBox">
|
||
<img src="./images/page2Gift1.png" alt="" class="page2Gift">
|
||
<!-- 榜單盒子 -->
|
||
<div class="box">
|
||
<!-- 前三 -->
|
||
<div class="top3Box">
|
||
<div class="no1">
|
||
<div class="pot">
|
||
<img src="./images/page2No1.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>閃耀值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no2">
|
||
<div class="pot">
|
||
<img src="./images/page2No2.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>閃耀值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no3">
|
||
<div class="pot">
|
||
<img src="./images/page2No3.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>閃耀值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 非前三 -->
|
||
<img src="./images/page2-4-15.png" alt="" class="ulTitle">
|
||
<ul>
|
||
<li>
|
||
<div class="num">04</div>
|
||
<img src="./images/page2UlTs.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">閃耀值: 0</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<!-- 自己 -->
|
||
<div class="my">
|
||
<div class="num">未上榜</div>
|
||
<div class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
</div>
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">閃耀值: 0</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 頁面3 -->
|
||
<div class="page3">
|
||
<!-- 標題圖片 -->
|
||
<img src="./images/page3TitleIcon.png" alt="" class="page3TitleIcon">
|
||
<!-- 小時榜規則 -->
|
||
<img src="./images/page3RuleIcon.png" alt="" class="page3RuleIcon">
|
||
<!-- 切換tab容器 -->
|
||
<div class="page3tabBox">
|
||
<div class="tabBox">
|
||
<div class="tab act">
|
||
<p>海選賽</p>
|
||
<span>01.05-01.08</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>淘汰賽</p>
|
||
<span>01.09-01.011</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>晉級賽</p>
|
||
<span>01.12-01.14</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>沖刺賽</p>
|
||
<span>01.15-01.17</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>總決賽</p>
|
||
<span>01.18-01.19</span>
|
||
</div>
|
||
</div>
|
||
<div class="timeBox">
|
||
<p>當前賽季倒計時 <span class="sp1">0</span> 天 <span class="sp2">0</span> 時 <span class="sp3">0</span> 分 <span
|
||
class="sp4">0</span> 秒 </p>
|
||
</div>
|
||
</div>
|
||
<!-- 榜單盒子 -->
|
||
<div class="box">
|
||
<!-- 前三 -->
|
||
<div class="top3Box">
|
||
<div class="no no1">
|
||
<div class="pot">
|
||
<img src="./images/page2No1.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>人氣值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no no2">
|
||
<div class="pot">
|
||
<img src="./images/page2No2.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>人氣值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no no3">
|
||
<div class="pot">
|
||
<img src="./images/page2No3.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>人氣值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 非前三 -->
|
||
<ul>
|
||
<li>
|
||
<div class="num">04</div>
|
||
<img src="./images/page2UlTs.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">人氣值: 0</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<!-- 自己 -->
|
||
<div class="my">
|
||
<div class="num">未上榜</div>
|
||
<div class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
</div>
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">人氣值: 0</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 頁面4 -->
|
||
<div class="page4">
|
||
<!-- 標題圖片 -->
|
||
<img src="./images/page4TitleIcon.png" alt="" class="page3TitleIcon">
|
||
<!-- 切換tab容器 -->
|
||
<div class="page3tabBox">
|
||
<div class="tabBox">
|
||
<div class="tab act">
|
||
<p>海選賽</p>
|
||
<span>01.05-01.08</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>淘汰賽</p>
|
||
<span>01.09-01.011</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>晉級賽</p>
|
||
<span>01.12-01.14</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>半決賽</p>
|
||
<span>01.15-01.17</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>總決賽</p>
|
||
<span>01.18-01.19</span>
|
||
</div>
|
||
</div>
|
||
<div class="timeBox">
|
||
<p>當前賽季倒計時 <span class="sp1">0</span> 天 <span class="sp2">0</span> 時 <span class="sp3">0</span> 分 <span
|
||
class="sp4">0</span> 秒 </p>
|
||
</div>
|
||
</div>
|
||
<!-- 標題2 -->
|
||
<img src="./images/page4Title2.png" alt="" class="page4Title2">
|
||
<!-- 榜單盒子 -->
|
||
<div class="box">
|
||
<!-- 前三 -->
|
||
<div class="top3Box">
|
||
<div class="no no1">
|
||
<div class="pot">
|
||
<img src="./images/page2No1.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>榮耀值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no no2">
|
||
<div class="pot">
|
||
<img src="./images/page2No2.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>榮耀值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no no3">
|
||
<div class="pot">
|
||
<img src="./images/page2No3.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>榮耀值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 非前三 -->
|
||
<ul>
|
||
<li>
|
||
<div class="num">04</div>
|
||
<img src="./images/page2UlTs.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">榮耀值: 0</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<!-- 自己 -->
|
||
<div class="my">
|
||
<div class="num">未上榜</div>
|
||
<div class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
</div>
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">榮耀值: 0</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 頁面5 -->
|
||
<div class="page5">
|
||
<!-- 禮物切換展示 -->
|
||
<img src="./images/page3title.png" alt="" class="page3title">
|
||
<!-- 榜單盒子 -->
|
||
<div class="box">
|
||
<!-- 前三 -->
|
||
<div class="top3Box">
|
||
<div class="no1">
|
||
<div class="pot">
|
||
<img src="./images/page2No1.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>神豪值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no2">
|
||
<div class="pot">
|
||
<img src="./images/page2No2.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>神豪值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="no3">
|
||
<div class="pot">
|
||
<img src="./images/page2No3.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<span>神豪值:<b>0</b></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 非前三 -->
|
||
<ul>
|
||
<li>
|
||
<div class="num">04</div>
|
||
<img src="./images/page2UlTs.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">神豪值: 0</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<!-- 自己 -->
|
||
<div class="my">
|
||
<div class="num">未上榜</div>
|
||
<div class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
</div>
|
||
<div class="name">用戶昵稱</div>
|
||
<div class="score">神豪值: 0</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 活動規則彈窗 -->
|
||
<div class="rule">
|
||
<div class="rule_in">
|
||
<!-- 規則&獎勵 -->
|
||
<div class="TabBox">
|
||
<div class="act">規則</div>
|
||
<div>獎勵</div>
|
||
</div>
|
||
<!-- 小tab切換 -->
|
||
<div class="tabs">
|
||
<div class="act">年度摯友</div>
|
||
<div>禮物代言人</div>
|
||
<div>人氣主播</div>
|
||
<div style="display: none;">名廳之戰</div>
|
||
<div>年度神豪</div>
|
||
</div>
|
||
<!-- 切換tab容器 -->
|
||
<div class="content_tabBox">
|
||
<div class="tab act">
|
||
<p>海選賽</p>
|
||
<span>01.05-01.08</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>淘汰賽</p>
|
||
<span>01.09-01.011</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>晉級賽</p>
|
||
<span>01.12-01.14</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>沖刺賽</p>
|
||
<span>01.15-01.17</span>
|
||
</div>
|
||
<div class="tab">
|
||
<p>總決賽</p>
|
||
<span>01.18-01.19</span>
|
||
</div>
|
||
</div>
|
||
<!-- 切換tab容器 -->
|
||
<div class="content_tabBox2">
|
||
<div class="tab act">
|
||
<p>沖刺賽</p>
|
||
</div>
|
||
<div class="tab">
|
||
<p>總決賽</p>
|
||
</div>
|
||
</div>
|
||
<!-- 內容 -->
|
||
<div class="content1">
|
||
<img src="./images/rule1.png" alt="">
|
||
</div>
|
||
<div class="content2">
|
||
<img src="./images/rule21.png" alt="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 盛典任務彈窗 -->
|
||
<div class="celebrationTask">
|
||
<div class="celebrationTask_in">
|
||
<!-- 標題 -->
|
||
<img src="./images/celebrationTaskTitle.png" alt="" class="celebrationTaskTitle">
|
||
<!-- tab -->
|
||
<div class="tab">
|
||
<div class="act">盛典大咖</div>
|
||
<div class="">盛典新秀</div>
|
||
</div>
|
||
<!-- 當前用戶 -->
|
||
<div class="user">
|
||
<img src="./images/celebrationTaskTs.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<div class="score">
|
||
<span class="sp1">當前<i>貢獻值</i>: <b>0</b></span>
|
||
<span class="sp2">距下一級還需: <b>0</b></span>
|
||
</div>
|
||
</div>
|
||
<div class="tabBox1">
|
||
<i class="text">貢獻值：按照用戶在任意房間贈送鉆石禮物獲得貢獻值，1鉆石=1貢獻值</i>
|
||
<img src="./images/celebrationTaskLine.png" alt="" class="line">
|
||
<div class="celebrationTaskBox">
|
||
<div class="title">LV1</div>
|
||
<p>活動期間贈送<b>0</b>鉆石禮物</p>
|
||
<div class="giftBox">
|
||
<div>
|
||
<img src="" alt="">
|
||
<span>1天</span>
|
||
<i>獎勵名稱</i>
|
||
</div>
|
||
</div>
|
||
<div class="but">領取</div>
|
||
<div class="butNot">未滿足條件</div>
|
||
<i>1/8</i>
|
||
<img src="./images/celebrationTaskLeft.png" alt="" class="left">
|
||
<img src="./images/celebrationTaskRight.png" alt="" class="right">
|
||
</div>
|
||
</div>
|
||
<div class="tabBox2">
|
||
<i class="text">新秀值：按照用戶在任意房間收到鉆石禮物獲得貢獻值，1鉆石=1新秀值</i>
|
||
<img src="./images/celebrationTaskLine.png" alt="" class="line">
|
||
<div class="celebrationTaskBox">
|
||
<div class="title">LV1</div>
|
||
<p>活動期間收到<b>0</b>鉆石禮物</p>
|
||
<div class="giftBox">
|
||
<div>
|
||
<img src="" alt="">
|
||
<span>1天</span>
|
||
<i>獎勵名稱</i>
|
||
</div>
|
||
</div>
|
||
<div class="but">領取</div>
|
||
<div class="butNot">未滿足條件</div>
|
||
<i>0/8</i>
|
||
<img src="./images/celebrationTaskLeft.png" alt="" class="left">
|
||
<img src="./images/celebrationTaskRight.png" alt="" class="right">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 頁面3彈窗 -->
|
||
<div class="page3_pop">
|
||
<div class="page3_pop_in">
|
||
<!-- 標題 -->
|
||
<img src="./images/page3_popTitle.png" alt="" class="page3_popTitle">
|
||
<!-- 獎勵 -->
|
||
<img src="./images/titleTopBox.png" alt="" class="titleTopBox">
|
||
<img src="./images/page3_popLustTop3.png" alt="" class="page3_popLustTop3">
|
||
<!-- 前三 -->
|
||
<div class="lastTop3">
|
||
<img src="./images/celebrationTaskTs.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>用戶昵稱</p>
|
||
<div class="right">
|
||
<img src="./images/logo.png" alt="">
|
||
<i>最佳助力</i>
|
||
</div>
|
||
</div>
|
||
<!-- 線 -->
|
||
<img src="./images/celebrationTaskLine.png" alt="" class="line">
|
||
<!-- 時間 -->
|
||
<div class="timeBox">
|
||
<div class="div1">0點小時榜</div>
|
||
<div class="div2">剩余00分00秒</div>
|
||
</div>
|
||
<!-- 非前三 -->
|
||
<ul>
|
||
<li>
|
||
<div class="num">01</div>
|
||
<img src="./images/celebrationTaskTs.png" alt="" class="ts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<div class="user">
|
||
<p>用戶昵稱</p>
|
||
<span>人氣值:000</span>
|
||
</div>
|
||
<div class="right">
|
||
<img src="./images/logo.png" alt="">
|
||
<i>最佳助力</i>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<!-- 吸底 -->
|
||
<div class="bottom">小時榜僅在每晚19:00 - 23:59開啟</div>
|
||
</div>
|
||
|
||
<!-- 頁面4彈窗 -->
|
||
<div class="page4_pop">
|
||
<div class="page3_pop_in">
|
||
<!-- 頂部獎勵 -->
|
||
<img src="./images/page4_popTop.png" alt="" class="page4_popTop">
|
||
<!-- 線 -->
|
||
<img src="./images/celebrationTaskLine.png" alt="" class="line">
|
||
<ul>
|
||
<li>
|
||
<div class="lts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>房間名稱</p>
|
||
</div>
|
||
<div class="rts">
|
||
<img src="./images/logo.png" alt="" class="tx">
|
||
<p>房間名稱</p>
|
||
</div>
|
||
<span class="right">
|
||
<b>圍觀助力</b>
|
||
</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 活動結束 -->
|
||
<div class="actOut">
|
||
<div class="actOut_in">
|
||
<p>該活動已結束~</p>
|
||
<div class="but">查看榜單</div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
|
||
</html>
|
||
<script src="../../common/js/flexible.js"></script>
|
||
<script src="../../common/js/jquery-3.2.1.min.js"></script>
|
||
<script src="../../common/js/common2.js"></script>
|
||
<script src="../../common/js/layer.js"></script>
|
||
<script src="../../common/js/vconsole.min.js"></script>
|
||
<script src="../../common/js/route-constant.js"></script>
|
||
<!-- <script src="./js/wow.js"></script> -->
|
||
<script src="./js/index.js"></script> |