download_caigong2.html 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  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>APP下载</title>
  8. <style type="text/css">
  9. * {
  10. padding: 0;
  11. margin: 0;
  12. }
  13. #app {
  14. position: relative;
  15. width: 100vw;
  16. height: 100vh;
  17. overflow-y: hidden;
  18. }
  19. #app .bg {
  20. width: 100vw;
  21. }
  22. #app .download1 {
  23. position: absolute;
  24. left: 50%;
  25. transform: translate(-50%, 0%);
  26. width: 64vw;
  27. height: 12.8vw;
  28. line-height: 12.8vw;
  29. background: #498EF5;
  30. bottom: 27.8vw;
  31. color: white;
  32. text-align: center;
  33. font-size: 6.4vw;
  34. border-radius: 48px;
  35. }
  36. #app .download2 {
  37. position: absolute;
  38. left: 50%;
  39. transform: translate(-50%, 0%);
  40. width: 64vw;
  41. height: 12.8vw;
  42. line-height: 12.8vw;
  43. background: #498EF5;
  44. bottom: 10vw;
  45. color: white;
  46. text-align: center;
  47. font-size: 6.4vw;
  48. border-radius: 48px;
  49. }
  50. #app .title{
  51. position: absolute;
  52. top: 18vw;
  53. width: 100%;
  54. color: white;
  55. text-align: center;
  56. }
  57. #app .subtitle{
  58. position: absolute;
  59. top: 40vw;
  60. width: 100%;
  61. color: white;
  62. font-size: 18px;
  63. text-align: center;
  64. }
  65. #app #tip {
  66. display: none;
  67. position: absolute;
  68. z-index: 1000;
  69. width: 100%;
  70. }
  71. #app #tip .tip {
  72. width: 100vw;
  73. }
  74. </style>
  75. </head>
  76. <body>
  77. <div id="app">
  78. <div id="tip">
  79. <img class="tip" src="./assets/tip.png">
  80. </div>
  81. <div class="title">
  82. <img style="width: 72vw;" src="./assets/财仝驾考APP2.png">
  83. </div>
  84. <div class="subtitle">
  85. <span style="color:#656565">一款为驾考学员打造的专业软件</span>
  86. </div>
  87. <img class="bg" src="./assets/bg2.png">
  88. <a href="https://ys.zzxcx.net/apk/sdjkAndroid1.2.2.apk">
  89. <div class="download1">
  90. 点击下载1
  91. </div>
  92. </a>
  93. <a href="https://ys.zzxcx.net/apk/sdjkAndroid1.2.2.apk">
  94. <div class="download2">
  95. 点击下载(备用)
  96. </div>
  97. </a>
  98. <a onclick="openWxDownloadTip()">
  99. <div class="download1">
  100. 点击下载1
  101. </div>
  102. </a>
  103. <a onclick="openWxDownloadTip()">
  104. <div class="download2">
  105. 点击下载(备用)
  106. </div>
  107. </a>
  108. </div>
  109. <script>
  110. function is_weixin() {
  111. var ua = navigator.userAgent.toLowerCase();
  112. if (ua.match(/MicroMessenger/i) == "micromessenger") {
  113. return true;
  114. } else {
  115. return false;
  116. }
  117. }
  118. function openWxDownloadTip(){
  119. document.getElementById('tip').style.display = 'block'
  120. }
  121. window.onload = function () {
  122. if (is_weixin()) {
  123. document.querySelectorAll('#app a')[0].style.display = 'none'
  124. document.querySelectorAll('#app a')[1].style.display = 'none'
  125. }
  126. else {
  127. document.querySelectorAll('#app a')[2].style.display = 'none'
  128. document.querySelectorAll('#app a')[3].style.display = 'none'
  129. }
  130. }
  131. </script>
  132. </body>
  133. </html>