首页/ mobileweb/ 小草问卷宝/ 代码预览

💻 代码预览 · 小草问卷宝

mw_tool · 上传者 小草网络
← 返回详情
小草问卷宝_H5/rank.html · 约 2357 字符
1<!DOCTYPE html>
2<html lang="zh-CN">
3<head>
4<meta charset="UTF-8"/>
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
6<title>答题排行榜 · 小草问卷宝</title>
7<link rel="stylesheet" href="style.css"/>
8</head>
9<body>
10
11<header class="header"><a class="back" onclick="history.back()">‹</a><h1>答题排行榜</h1><span class="right"></span></header>
12<div class="filter-tabs">
13  <div class="filter-tab sel">周榜</div>
14  <div class="filter-tab">日榜</div>
15  <div class="filter-tab">月榜</div>
16  <div class="filter-tab">总榜</div>
17</div>
18<div class="rank-podium">
19  <div class="rp-item rp-2"><div class="rp-crown"></div><div class="rp-avatar">👨</div><div class="rp-name">阿凯</div><div class="rp-amt">¥112</div></div>
20  <div class="rp-item rp-1"><div class="rp-crown">👑</div><div class="rp-avatar">👩</div><div class="rp-name">小鹿</div><div class="rp-amt">¥128.5</div></div>
21  <div class="rp-item rp-3"><div class="rp-crown"></div><div class="rp-avatar">👩‍🦰</div><div class="rp-name">莉莉</div><div class="rp-amt">¥98.6</div></div>
22</div>
23<div class="section-title">本周榜单 <span>我的排名 18 位</span></div>
24<div class="rank-list" id="rankList"></div>
25<div class="card" style="font-size:12px;color:#5c7f74;line-height:1.9">
26  🏅 每周日 24:00 结算:周榜前 10 名额外奖励 ¥5-50 现金红包;连续 4 周进榜升级「金牌答手」,高额问卷优先推送。
27</div>
28
29
30<nav class="tabbar"><a class=" active" href="index.html"><span class="icon">🏠</span>首页</a><a class="" href="surveys.html"><span class="icon">📋</span>问卷</a><a class="" href="tasks.html"><span class="icon">🎯</span>任务</a><a class="" href="wallet.html"><span class="icon">💰</span>钱包</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
31<script src="data.js"></script>
32<script>
33  var rl = document.getElementById('rankList');
34  var h = '';
35  window.DATA.rankWeek.forEach(function (r, i) {
36    h += '<div class="rank-item"><div class="rk-no">' + (i + 1) + '</div><div class="rk-avatar">' + r.avatar + '</div><div class="rk-name">' + r.name + '</div><div class="rk-val">' + r.amt + '</div></div>';
37  });
38  rl.innerHTML = h;
39</script>
40<script src="app.js"></script>
41</body>
42</html>