Files
yinmeng-h5/view/yinmeng/activity/2024-lover/index.html
2024-02-13 00:58:31 +08:00

392 lines
16 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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">
<div class="rule_icon"></div>
</div>
<!-- tab切换 -->
<div class="tab">
<div class="act">萌动花盒</div>
<div>甜蜜升温</div>
<div>热恋时刻</div>
</div>
<!-- 页面1 -->
<div class="page1">
<div class="bg1">
<!-- 标题 -->
<img src="./images/page1Bg1Title.png" alt="" class="title">
<!-- 爱心盒子 -->
<img src="./images/loveBox.png" alt="" class="loveBox">
<!-- 文案 -->
<p class="p1">活动期间开出「萌动花盒」中的6种不同礼物</p>
<p class="p2">可获得「初心萌动」限定铭牌</p>
<p class="p3">今日奖励已发放</p>
<p class="p4">奖励自动发放每日仅可领取一次点亮结果和奖励每日中午12点自动刷新</p>
<!-- 铭牌 -->
<img src="./images/mp.png" alt="" class="mp">
<!-- 点亮列表 -->
<div class="giftListBox">
<div class="giftList giftList1 filter">
<div class="qp"></div>
<img src="./images/1.png" alt="" class="gift">
<div class="giftName">白玫瑰</div>
<div class="giftVAlue">1314钻</div>
</div>
<div class="giftList giftList2 filter">
<div class="qp"></div>
<img src="./images/2.png" alt="" class="gift">
<div class="giftName">红玫瑰</div>
<div class="giftVAlue">1314钻</div>
</div>
<div class="giftList giftList3 filter">
<div class="qp"></div>
<img src="./images/3.png" alt="" class="gift">
<div class="giftName">粉玫瑰</div>
<div class="giftVAlue">1314钻</div>
</div>
<div class="giftList giftList4 filter">
<div class="qp"></div>
<img src="./images/4.png" alt="" class="gift">
<div class="giftName">彩玫瑰</div>
<div class="giftVAlue">1314钻</div>
</div>
<div class="giftList giftList5 filter">
<div class="qp"></div>
<img src="./images/5.png" alt="" class="gift">
<div class="giftName">炽热爱恋</div>
<div class="giftVAlue">1314钻</div>
</div>
<div class="giftList giftList6 filter">
<div class="qp"></div>
<img src="./images/6.png" alt="" class="gift">
<div class="giftName">纯白爱恋</div>
<div class="giftVAlue">1314钻</div>
</div>
</div>
</div>
<div class="bg2">
<!-- 标题 -->
<img src="./images/page1Bg2Title.png" alt="" class="title">
<!-- 列表 -->
<ul>
<li class="liTitle">
<div>点亮时间</div>
<div>获得奖励</div>
</li>
<li>
<div class="left">
<p>2024/2/1</p>
<span>00:00:00</span>
</div>
<div>xxxx铭牌</div>
</li>
<li class="null">
<div>暂无点亮记录,快去集齐礼物吧~</div>
</li>
</ul>
</div>
</div>
<!-- 页面2 -->
<div class="page2">
<div class="box">
<!-- 标题 -->
<img src="./images/page2Title.png" alt="" class="title">
<!-- 购买记录icon -->
<img src="./images/page2Buy_icon.png" alt="" class="page2Buy_icon">
<!-- 文案 -->
<i class="i1">剩余时间:00天12时12分</i>
<i class="i2">活动期间送礼到达指定任务值,可解锁超珍稀限时礼物直购权</i>
<i class="i3">1钻石送礼=1礼物值</i>
<!-- 任务 -->
<div class="tasks tasks1 taskss">
<div class="giftBox">
<div class="qp"></div>
<img src="./images/tasks1.png" alt="" class="gift">
<div class="giftName">心动一刹</div>
<div class="giftVAlue">13140钻</div>
</div>
<p class="p1">每达到52000礼物值可解锁1次直购权</p>
<p class="p2">礼物值</p>
<p class="p3">当前可购买: X个</p>
<div class="line">
<span></span>
<i class="i">0/1000</i>
</div>
<div class="buy">
<img src="./images/diamond.png" alt="" class="diamond">
1314购买
</div>
</div>
<div class="tasks2 taskss">
<div class="giftBox">
<div class="qp"></div>
<img src="./images/tasks2.png" alt="" class="gift">
<div class="giftName">绝对宠溺</div>
<div class="giftVAlue">33440钻</div>
</div>
<p class="p1">每达到1314520礼物值可解锁1次直购权</p>
<p class="p2">礼物值</p>
<p class="p3">当前可购买: X个</p>
<div class="line">
<span></span>
<i class="i">0/2000</i>
</div>
<div class="buy">
<img src="./images/diamond.png" alt="" class="diamond">
3344购买
</div>
</div>
</div>
</div>
<!-- 页面3 -->
<div class="page3">
<!-- 奖励任务 -->
<div class="box">
<!-- 文案 -->
<i class="i2">突破热恋值,领取限时装扮奖励!
女性用户获得粉色装扮,男性用户获得蓝色装扮
每个用户仅能获取1次将自动发放至「我的装扮」</i>
<!-- 任务 -->
<div class="tasks tasks1">
<div class="giftBox">
<div class="qp"></div>
<!-- <img src="./images/logo.png" alt="" class="gift"> -->
<div class="giftName">糖果恋人头饰</div>
<div class="giftVAlue">13140热恋值</div>
</div>
<p class="p1">糖果恋人头饰-情人节限定</p>
<p class="p2">热恋值</p>
<p class="p3">有效期24H</p>
<div class="line">
<span></span>
<i class="i">0/1000</i>
</div>
<div class="buy">
未完成
</div>
</div>
<div class="tasks2">
<div class="giftBox">
<div class="qp"></div>
<!-- <img src="./images/logo.png" alt="" class="gift"> -->
<div class="giftName">糖果恋人气泡</div>
<div class="giftVAlue">33440热恋值</div>
</div>
<p class="p1">糖果恋人气泡·情人节限定</p>
<p class="p2">热恋值</p>
<p class="p3">有效期24H</p>
<div class="line">
<span></span>
<i class="i">0/1000</i>
</div>
<div class="buy">
未完成
</div>
</div>
</div>
<!-- 前三 -->
<div class="top3">
<!-- 标题 -->
<div class="title">热恋榜单</div>
<!-- 榜单奖励 -->
<img src="./images/page3Rule_icon.png" alt="" class="rule_icon">
<!-- 前三列表 -->
<div class="no1">
<img src="./images/page3Top1.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="leftlogo">
<img src="./images/logo.png" alt="" class="rightlogo">
<div class="name">我是男用户6...<i> & </i>我是女用户6...</div>
<span class="score">9999热恋值</span>
</div>
<div class="no2">
<img src="./images/page3Top2.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="leftlogo">
<img src="./images/logo.png" alt="" class="rightlogo">
<div class="name">我是男用户6...<i> & </i>我是女用户6...</div>
<span class="score">9999热恋值</span>
</div>
<div class="no3">
<img src="./images/page3Top3.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="leftlogo">
<img src="./images/logo.png" alt="" class="rightlogo">
<div class="name">我是男用户6...<i> & </i>我是女用户6...</div>
<span class="score">9999热恋值</span>
</div>
</div>
<!-- 非前三 -->
<ul>
<li>
<div class="num">4</div>
<img src="./images/logo.png" alt="" class="leftTx">
<img src="./images/logo.png" alt="" class="rightTx">
<div class="leftName">我是男用户的...</div>
<div class="rightName">我是男用户的...</div>
<div class="score">0</div>
</li>
</ul>
<!-- 自己组合 -->
<div class="my">
<img src="./images/top.png" alt="" class="icon">
<div class="scroll">
<div class="myBox">
<div class="num">4</div>
<img src="./images/logo.png" alt="" class="leftTx">
<img src="./images/logo.png" alt="" class="rightTx">
<div class="leftName">1我是男用户的...</div>
<div class="rightName">1我是男用户的...</div>
<div class="score">0</div>
</div>
</div>
</div>
</div>
<!-- 购买记录弹窗 -->
<div class="buyRecords">
<div class="buyRecords_in">
<!-- 标题 -->
<img src="./images/page2RuleTitle.png" alt="" class="title">
<!-- 列表 -->
<ul>
<li class="liTitle">
<div>购买时间</div>
<div>购买礼物</div>
</li>
<li>
<div class="left">
<p>2024/2/1</p>
<span>00:00:00</span>
</div>
<div>xxxx礼物*1个</div>
</li>
<li class="null">
<div>暂无购买记录~</div>
</li>
</ul>
</div>
</div>
<!-- 活动规则弹窗 -->
<div class="rule">
<div class="rule_in">
<!-- 标题 -->
<img src="./images/ruleTitle.png" alt="" class="title">
<!-- 列表 -->
<ul>
<li>一、活动时间:</li>
<li> 2024年2月12日12:00:00—2024年2月16日23:59:59</li>
<li> 二、热恋情人节</li>
<li> 1. 萌动花盒</li>
<li> a. 活动期间1314钻石萌动花盒幸运礼物限时上线花盒内有6种不同礼物每次送出随机解锁1种</li>
<li> b.每送出花盒内的一种礼物皆可点亮对应拼图所有拼图全部点亮即可获得24H【初心萌动】铭牌奖励</li>
<li> c. 拼图进度每日中午12点重置活动期间每天均可完成1次 </li>
<li>2. 甜蜜升温</li>
<li> a. 活动期间,超珍稀礼物直购限时开放,赠送礼物每达指定价值即可解锁直购</li>
<li>b. 赠送礼物价值每满52000钻即可购买【心动一刹13140钻】</li>
<li>c. 赠送礼物价值每满131452钻即可购买【绝对宠溺33440钻】 </li>
<li>d. 购买的礼物将直接放入背包当中</li>
<li>3. 热恋时刻</li>
<li>a. 活动时间2月14日0:00:00—2月15日00:00:00</li>
<li>b. 活动时间内比拼热恋值收到1钻=1热恋值</li>
<li>c. 活动时间内热恋值满13140可获得24H【糖果恋人】头像框奖励热恋值满33440可获得24H【糖果恋人】气泡奖励</li>
<li>d. 大头号牌照房房主和家族长不可以组成CP不参与榜单活动排名</li>
<li>e. 榜单奖励TOP1可额外获得情侣靓号5203344&3344520*30天TOP1-3均可获得【挚爱唯一】专属铭牌、头像框、资料卡、专属开屏1天</li>
<li>三、特别说明</li>
<li>1.靓号持有者需要在活动结束后2周内确认靓号否则将自动过期无法使用</li>
<li>2.本活动最终解释权归音萌所有,本活动以及奖励与苹果公司无关;</li>
</ul>
</div>
</div>
<!-- 活动结束弹窗 -->
<div class="end">
<div class="end_in">
<img src="./images/endTitle.png" alt="" class="title">
<div class="but">查看榜单</div>
</div>
</div>
<!-- 购买失败弹窗 -->
<div class="failureBuy">
<div class="failureBuy_in">
<img src="./images/failureBuyTitle.png" alt="" class="title">
<div class="text">钻石余额不足</div>
<div class="but close">关闭</div>
<div class="but ok">前往充值</div>
</div>
</div>
<!-- 购买成功弹窗 -->
<div class="success">
<div class="success_in">
<img src="./images/buyTitle.png" alt="" class="title">
<div class="giftListSuccess">
<div class="qp"></div>
<img src="./images/logo.png" alt="" class="gift">
<div class="giftName">礼物名称</div>
<div class="giftVAlue">0钻</div>
</div>
<div class="text">xxxx礼物名*1已发放至「我的背包」</div>
<div class="but">知道了</div>
</div>
</div>
<!-- 二次确认购买弹窗 -->
<div class="sure">
<div class="sure_in">
<img src="./images/sureTitle.png" alt="" class="title">
<div class="text">购买成功后将自动发放至「我的背包」</div>
<div class="giftListSuccess">
<div class="qp"></div>
<img src="./images/logo.png" alt="" class="gift">
<div class="giftName">礼物名称</div>
<div class="giftVAlue">0钻</div>
</div>
<div class="but close">下次再说</div>
<div class="but ok">立即购买</div>
</div>
</div>
<!-- 榜单奖励弹窗 -->
<div class="page3Rule">
<div class="page3Rule_in">
<img src="./images/page3Title.png" alt="" class="title">
<div class="box">
<img src="./images/page3Rule_inBg.png" alt="">
</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/index.js"></script>