h5.html 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Elin Dance Studio</title>
  8. <link rel="stylesheet" href="/assets/appdown/common/style.css">
  9. <script type="text/javascript" src="/assets/appdown/common/resize.js"></script>
  10. <script type="text/javascript" src="/assets/appdown/common/jquery.min.js"></script>
  11. <style>
  12. .page{
  13. height: 100vh;
  14. width: 100%;
  15. background: url(/assets/appdown/images/h5_bg.png) no-repeat center/cover;
  16. }
  17. .header-placer{
  18. height: 8%;
  19. width: 100%;
  20. }
  21. .p-header{
  22. height: 9%;
  23. }
  24. .p-header .logo{
  25. height: 100%;
  26. width: auto;
  27. object-fit: cover;
  28. margin: 0 auto;
  29. }
  30. .p-placer{
  31. height: 12%;
  32. }
  33. .p-ic .ic{
  34. height: 63%;
  35. width: 100%;
  36. object-fit: cover;
  37. }
  38. .p-bom{
  39. height: 30%;
  40. background-color: #2A2A2A;
  41. width: 100%;
  42. position: absolute;
  43. bottom: 0;
  44. left: 0;
  45. z-index: 10;
  46. }
  47. .p-bom .line1{
  48. height: 12%;
  49. width: 100%;
  50. }
  51. .p-bom .btn{
  52. height: 27%;
  53. text-align: center;
  54. }
  55. .p-bom .btn img{
  56. height: 100%;
  57. width: auto;
  58. object-fit: cover;
  59. }
  60. .p-bom .line2{
  61. height: 10%;
  62. width: 100%;
  63. }
  64. .p-bom .tips{
  65. height: 22%;
  66. }
  67. .p-bom .line3{
  68. height: 3%;
  69. width: 100%;
  70. }
  71. .p-bom .tips .txt{
  72. font-size: 0.24rem;
  73. font-family: PingFang SC;
  74. font-weight: 500;
  75. color: #96C4FF;
  76. opacity: 0.5;
  77. }
  78. </style>
  79. </head>
  80. <body>
  81. <div class="page">
  82. <div class="header-placer"></div>
  83. <div class="p-header align-center justify-center">
  84. <img src="/assets/appdown/images/h5_logo.png" alt="" class="logo">
  85. </div>
  86. <div class="p-placer"></div>
  87. <div class="p-ic">
  88. <img src="/assets/appdown/images/h5_pic.png" class="ic">
  89. </div>
  90. <div class="p-bom flex-col align-center">
  91. <div class="line1"></div>
  92. <a href="{$ios_downurl}" class="btn">
  93. <img data-locale="ios_down_img" src="/assets/appdown/images/h5zh_ios.png" alt="">
  94. </a>
  95. <div class="line2"></div>
  96. <a href="{$android_apkUrl}" class="btn">
  97. <img data-locale="android_down_img" src="/assets/appdown/images/h5zh_andr.png" alt="">
  98. </a>
  99. <div class="line3"></div>
  100. <p class="tips align-center justify-center">
  101. <span class="txt" data-locale="down_tips">Elin安全专属页面,请放心下载</span>
  102. </p>
  103. </div>
  104. </div>
  105. </body>
  106. </html>
  107. <script>
  108. function docReady(fn) {
  109. if (document.readyState === 'complete' || document.readyState === 'interactive') {
  110. fn()
  111. } else {
  112. document.addEventListener('DOMContentLoaded', fn);
  113. }
  114. }
  115. function GetRequest() {
  116. var url = location.search;
  117. var theRequest = new Object();
  118. // console.log('url---',url)
  119. if (url.indexOf('?') != -1) {
  120. var str = url.substr(1);
  121. // console.log('str---',str)
  122. var strs = str.split('&');
  123. for (var i = 0; i < strs.length; i++) {
  124. theRequest[strs[i].split('=')[0]] = (strs[i].split('=')[1]);
  125. }
  126. }
  127. return theRequest;
  128. }
  129. var Request = new Object();
  130. Request = GetRequest();
  131. // let query = "order_no=" + Request.orderNo + "&name=" + Request.name + "&money=" + Request.money + "&token=" + Request
  132. // .token + "&logo=" + Request.logo
  133. let query = 'i=a';
  134. docReady(async function() {
  135. // 语言包
  136. const langZH = {
  137. ios_down_img: '/assets/appdown/images/h5zh_ios.png',
  138. android_down_img: '/assets/appdown/images/h5zh_andr.png',
  139. down_tips: 'Elin安全专属页面,请放心下载',
  140. }
  141. const langEN = {
  142. ios_down_img: '/assets/appdown/images/h5en_ios.png',
  143. android_down_img: '/assets/appdown/images/h5en_andr.png',
  144. down_tips: "Elin Safe and dedicated page, please feel free to download",
  145. }
  146. function loadLang(lang){
  147. $("[data-locale]").each(function () {
  148. var key = $(this).data("locale");
  149. // console.log("===",key,lang[key])
  150. if(key.indexOf('_img') !== -1){
  151. $(this).attr("src", lang[key]);
  152. }else{
  153. $(this).html(lang[key]);
  154. }
  155. });
  156. }
  157. loadLang(langEN);
  158. })
  159. </script>