Domů Procházet Nápověda
Registrovat se Přihlásit se
tangdehang
/
android-cloud-H5
Sledovat 1
Oblíbit 0
Rozštěpit 0
Soubory Úkoly 0 Pull Requesty 0 Wiki
Procházet zdrojové kódy

领取游戏激活码的H5落地页

heyang před 3 roky
rodič
621e8b5ff3
revize
a186054237
9 změnil soubory, kde provedl 287 přidání a 0 odebrání
Rozdělené zobrazení Ukázat statistiku rozdílových dat
  1. 169 0
      microserviceUserH5/static/css/activationCode.css
  2. binární
      microserviceUserH5/static/img/copy.png
  3. binární
      microserviceUserH5/static/img/game.png
  4. binární
      microserviceUserH5/static/img/gameClose.png
  5. binární
      microserviceUserH5/static/img/getGif.png
  6. binární
      microserviceUserH5/static/img/gifContent.png
  7. binární
      microserviceUserH5/static/img/success.png
  8. binární
      microserviceUserH5/static/img/tryPlay.png
  9. 118 0
      microserviceUserH5/vcloud/activationCode.html

+ 169 - 0
microserviceUserH5/static/css/activationCode.css
Zobrazit soubor 

@@ -0,0 +1,169 @@
 
+@media screen and (max-width: 750px) {
 
+  html {
 
+    font-size: calc(100vw / 7.5);
 
+  }
 
+}
 
+
 
+@media screen and (min-width: 750px) {
 
+  html {
 
+    font-size: calc(450px / 7.5);
 
+  }
 
+}
 
+
 
+html, body, div, ul, li, p {
 
+  padding: 0;
 
+  margin: 0;
 
+}
 
+
 
+ul, li {
 
+  list-style: none;
 
+}
 
+
 
+.code-container {
 
+  position: relative;
 
+  width: 7.5rem;
 
+  height: 100vh;
 
+  margin: 0 auto;
 
+  background: url(../img/game.png);
 
+  background-repeat: repeat-y;
 
+  background-size: cover;
 
+}
 
+
 
+.bottom-content{
 
+  position: absolute;
 
+  bottom: 0.53rem;
 
+  left: 0.89rem;
 
+}
 
+
 
+.img-container{
 
+  width: 5.72rem;
 
+  height: 5.17rem;
 
+}
 
+
 
+.btn-content{
 
+  position: absolute;
 
+  bottom: 0.62rem;
 
+  left: 1.25rem;
 
+}
 
+
 
+.get-gif, .try-play{
 
+  width: 3.22rem;
 
+  height: 0.9rem;
 
+  display: block;
 
+}
 
+
 
+.try-play{
 
+  margin-top: 0.14rem;
 
+}
 
+
 
+.mask {
 
+  width: 7.5rem;
 
+  height: 100vh;
 
+  position: absolute;
 
+  top: 0;
 
+  left: 0;
 
+  background: rgba(0, 0, 0, 0.24);
 
+  display: none;
 
+}
 
+
 
+.dialog {
 
+  width: 5.97rem;
 
+  height: 4.58rem;
 
+  background: #FFFFFF;
 
+  border-radius: 0.2rem;
 
+  position: absolute;
 
+  left: 0.72rem;
 
+  top: -6.96rem;
 
+  overflow: hidden;
 
+}
 
+
 
+.close {
 
+  width: 0.24rem;
 
+  height: 0.25rem;
 
+  background: url(../img/gameClose.png) no-repeat;
 
+  background-size: 100% 100%;
 
+}
 
+
 
+.head-list{
 
+  display: flex;
 
+  justify-content: space-between;
 
+  align-items: center;
 
+  padding: 0 0.28rem;
 
+  height: 0.67rem;
 
+  background: linear-gradient(0deg, #E2FFF6 0%, #D0FCEC 100%);
 
+}
 
+
 
+.head-title{
 
+  font-size: 0.33rem;
 
+}
 
+
 
+.content{
 
+  margin: 0.97rem 0 0.28rem 0;
 
+  text-align: center;
 
+  font-size: 0.28rem;
 
+}
 
+
 
+#copy-code{
 
+  width: 4.31rem;
 
+  height: 0.86rem;
 
+  line-height: 0.86rem;
 
+  text-align: center;
 
+  font-size: 0.33rem;
 
+  background: #EBEBEB;
 
+  border-radius: 0.14rem;
 
+  margin: 0 auto;
 
+}
 
+
 
+.btn-list{
 
+  display: flex;
 
+  justify-content: flex-end;
 
+  margin-top: 0.68rem;
 
+}
 
+
 
+.close-text{
 
+  width: 0.74rem;
 
+  height: 0.5rem;
 
+  line-height: 0.5rem;
 
+  text-align: center;
 
+  font-size: 0.25rem;
 
+  background: #EBEBEB;
 
+  border-radius: 0.11rem;
 
+}
 
+
 
+.copy-btn{
 
+  width: 1.39rem;
 
+  height: 0.5rem;
 
+  margin: 0 0.25rem 0 0.14rem;
 
+}
 
+
 
+.copy-success{
 
+  width: 4.88rem;
 
+  height: 4.88rem;
 
+  display: flex;
 
+  flex-direction: column;
 
+  justify-content: center;
 
+  align-items: center;
 
+  background: #666666;
 
+  border-radius: 0.23rem;
 
+  position: absolute;
 
+  left: 1.31rem;
 
+  transform: scale(0);
 
+  top: 4.36rem;
 
+  overflow: hidden;
 
+  transition: all 0.3s ease;
 
+}
 
+
 
+.on{
 
+  transform: scale(1);
 
+}
 
+
 
+.success-img{
 
+  width: 3rem;
 
+  height: 3rem;
 
+}
 
+
 
+.success-text{
 
+  margin-top: 0.2rem;
 
+  color: #FFFFFF;
 
+  font-size: 0.28rem;
 
+}

binární
microserviceUserH5/static/img/copy.png
Zobrazit soubor


binární
microserviceUserH5/static/img/game.png
Zobrazit soubor


binární
microserviceUserH5/static/img/gameClose.png
Zobrazit soubor


binární
microserviceUserH5/static/img/getGif.png
Zobrazit soubor


binární
microserviceUserH5/static/img/gifContent.png
Zobrazit soubor


binární
microserviceUserH5/static/img/success.png
Zobrazit soubor


binární
microserviceUserH5/static/img/tryPlay.png
Zobrazit soubor


+ 118 - 0
microserviceUserH5/vcloud/activationCode.html
Zobrazit soubor 

@@ -0,0 +1,118 @@
 
+<!DOCTYPE html>
 
+<html lang="zh-CN">
 
+
 
+<head>
 
+	<meta charset="UTF-8">
 
+	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
 
+	<title>激活码领取页</title>
 
+	<link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico">
 
+	<link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css">
 
+	<link rel="stylesheet" href="../static/css/activationCode.css">
 
+	<script src="../static/js/vender/jquery-3.4.1.min.js"></script>
 
+	<script src="../static/js/vender/toastr/toastr.min.js"></script>
 
+	<script src="../static/js/vender/config.js"></script>
 
+</head>
 
+
 
+<body>
 
+	<div class="code-container">
 
+		<div class="bottom-content">
 
+			<img class="img-container" src="../static/img/gifContent.png" />
 
+			<div class="btn-content">
 
+				<img class="get-gif" src="../static/img/getGif.png" />
 
+				<img class="try-play" src="../static/img/tryPlay.png" />
 
+			</div>
 
+		</div>
 
+		<div class="mask">
 
+			<div class="dialog">
 
+				<div class="head-list">
 
+					<div class="head-title">提示信息</div>
 
+					<div class="close"></div>
 
+				</div>
 
+				<div class="content">恭喜您，激活码领取成功！</div>
 
+				<div id="copy-code">P005242s5c</div>
 
+				<div class="btn-list">
 
+					<div class="close-text">关闭</div>
 
+				    <img class="copy-btn" src="../static/img/copy.png" />
 
+				</div>
 
+			</div>
 
+		</div>
 
+		<div class="copy-success">
 
+			<img class="success-img" src="../static/img/success.png" />
 
+			<div class="success-text">复制成功</div>
 
+		</div>
 
+	    <input type="text" style="opacity: 0;z-index: -10;position: fixed;" id="codeCopy" value="">
 
+	</div>
 
+	<script>
 
+		toastr.options.positionClass = 'toast-center-center';
 
+		toastr.options.timeOut = '1500';
 
+	</script>
 
+	<script type="text/javascript">
 
+        // var baseUrl = 'http://192.168.31.198'
 
+	    let timer,flag = true;
 
+		var url = window.location.href;
 
+		url = url.split('/')
 
+		var loc = window.location.search,
 
+		    n1 = loc.length,//地址的总长度
 
+		    n2 = loc.indexOf("="),//取得=号的位置
 
+		    id = loc.substr(n2 + 1, n1 - n2);//从=号后面的内容
 
+		$.ajax({
 
+			url: baseUrl + '/api/public/v1/game/activationCode',
 
+			type: 'get',
 
+			headers: {
 
+				// 'Authorization': id  //id
 
+			},
 
+			contentType: "application/json",
 
+			dataType: 'json',
 
+			cache: false,
 
+			success: function (res) {
 
+				console.log(res)
 
+				$('#copy-code').text('P005242235')
 
+				if (res.data.friendList.length > 0) {
 
+					
+				}
 
+			},
 
+		})
 
+
 
+	    $('.get-gif')[0].addEventListener('click',handleShow,false);
 
+		function handleShow() {
 
+			$('.dialog').animate({top: '4.36rem'},"fast");
 
+			$('.mask').show();
 
+			document.documentElement.style.overflow='hidden';
 
+		}
 
+	    $('.close')[0].addEventListener('click',handleClose,false);
 
+	    $('.close-text')[0].addEventListener('click',handleClose,false);
 
+		function handleClose() {
 
+			$('.dialog').animate({top: '-6.96rem'},"fast");
 
+			$('.mask').hide();
 
+			document.documentElement.style.overflow='auto';
 
+		}
 
+		$('.copy-btn')[0].addEventListener('click',copyCode,false);
 
+		//复制按钮
 
+		function copyCode() {
 
+			stopManyClick(() =>{
 
+				//加载数据
 
+				$('#codeCopy').val($('#copy-code').text());
 
+				var input = document.getElementById("codeCopy");
 
+				// 选中文本
 
+				input.select();
 
+				// 执行浏览器复制命令
 
+				document.execCommand("copy");
 
+				$('.copy-success').addClass('on');
 
+				setTimeout(() => {
 
+					$('.copy-success').removeClass('on');
 
+				},1500)
 
+			})
 
+		}
 
+		//防止提示一秒内重复显示
 
+		function stopManyClick(fn) {
 
+			if (flag) {
 
+				fn();
 
+			}
 
+			flag = false;
 
+			if(timer){clearTimeout(timer);}
 
+			timer = setTimeout(() => {flag = true}, 1500);
 
+		}
 
+	</script>
 
+</body>
 
+
 
+</html>