|
- <!DOCTYPE html>
- <html lang="en">
-
- <head>
- <meta charset="UTF-8" name="viewport"
- content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
- <title>Landing Page</title>
- <style>
- * {
- margin: 0;
- padding: 0;
- }
-
- img {
- display: block;
- object-fit: cover;
- }
-
- .center {
- display: flex;
- align-items: center;
- justify-content: center;
- }
-
- .universal-bg {
- background-size: cover;
- background-repeat: no-repeat;
- }
-
- .box {
- overflow: hidden;
- width: 100vw;
- height: 100vh;
- background-image: url("http://www.hairuyi.com/View/index/img/appapi/comm/pullnew_bgimg.png");
- background-color: #8d2527;
- background-position: center top;
- }
-
- .dialog {
- overflow: hidden;
- margin: calc((266 / 750) * 100vw) auto;
- width: calc((669 / 750) * 100vw);
- height: calc((906 / 750) * 100vw);
- background-image: url("http://www.hairuyi.com/View/index/img/appapi/comm/pullnew_tipimg.png");
- }
-
- .pull-new {
- margin: calc((227 / 750) * 100vw) auto calc((57 / 750) * 100vw) auto;
- width: calc((409 / 750) * 100vw);
- height: calc((57 / 750) * 100vw);
- }
-
- .first-label-box {
- height: calc((59 / 750) * 100vw);
- font: bold calc((62 / 750) * 100vw) Source Han Sans CN;
- color: #FFEFCB;
- }
-
- .second-label-box {
- margin-top: calc((21 / 750) * 100vw);
- height: calc((47 / 750) * 100vw);
- font: 800 calc((48 / 750) * 100vw) Source Han Sans CN;
- color: #FFEFCB;
- }
-
- .img-btn {
- margin: calc((81 / 750) * 100vw) auto calc((9 / 750) * 100vw) auto;
- width: calc((183 / 750) * 100vw);
- height: calc((201 / 750) * 100vw);
- animation: btn-scale .6s linear infinite alternate;
- }
-
- .logo {
- margin: 0 auto;
- width: calc((136 / 750) * 100vw);
- height: calc((40 / 750) * 100vw);
- }
-
- @keyframes btn-scale {
- 0% {
- transform: scale(1);
- }
-
- 100% {
- transform: scale(1.2);
- }
- }
- </style>
- </head>
- <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
- <script>
- var qs = (function (a) {
- if (a == "") return {};
- var b = {};
- for (var i = 0; i < a.length; ++i) {
- var p = a[i].split('=');
- if (p.length != 2) continue;
- b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
- }
- return b;
- })(window.location.search.substr(1).split('&'));
-
- $(document).ready(function () {
- $.ajaxSettings.async = false;
- var style
- var mob_url
- var url = "invite/url?master_id=" + qs["master_id"]
-
- $.getJSON(url, function (data) {
- console.log(data.data.style)
- style = JSON.parse(data.data.style.toString())
- mob_url = data.data.mob_url
- });
- // console.log(style)
- // console.log(mob_url)
- loadJS(mob_url, function () {
- MobLink([
- {
- el: '#btn',//这个是对应点击按钮
- path: "/invited",
- params: {
- tgid: qs["invite_code"],//邀请码
- }
- },
-
- ]);
- });
- }
-
- )
-
-
-
- function loadJS(url, callback) {
-
- var script = document.createElement('script'),
- fn = callback || function () { $(".load").show(); };
- script.type = 'text/javascript';
-
- //IE
- if (script.readyState) {
-
- script.onreadystatechange = function () {
-
- if (script.readyState == 'loaded' || script.readyState == 'complete') {
- script.onreadystatechange = null;
- fn();
- }
- };
- } else {
- //其他浏览器
- script.onload = function () {
- fn();
- };
- }
- script.src = url;
- document.getElementsByTagName('head')[0].appendChild(script);
- }
- </script>
-
- <body>
-
- <div class="box universal-bg">
- <div class="dialog universal-bg">
- <img id='title' src="http://ossq.izhyin.cn/invite_url_title.png" alt="PullNew" class="pull-new" />
- <div id="content" class="first-label-box center">
- 恭喜您获得
- </div>
- <div id="subcontent" class="second-label-box center">
- 现金红包
- </div>
- <img src="http://ossq.izhyin.cn/invite_url_btn.png" alt="ImgBtn" class="img-btn" id='btn' />
- <img src="http://ossq.izhyin.cn/invite_url_bottom.png" alt="Logo" class="logo" id='logo' />
- </div>
- </div>
-
- </body>
-
- </html>
|