slide.html 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
  6. <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  7. <title>title</title>
  8. <link rel="stylesheet" type="text/css" href="css/api.css" />
  9. <link rel="stylesheet" type="text/css" href="css/swiper.min.css" />
  10. <style>
  11. html, body{
  12. height:100%;box-sizing:border-box;background:#ffffff;
  13. }
  14. .swiper-wrapper{
  15. background-color: #0D0D0D;
  16. }
  17. .swiper-container {
  18. width: 100%;
  19. height: 100%;
  20. }
  21. .swiper-slide {
  22. text-align: center;
  23. font-size: 18px;
  24. background: #ffffff;
  25. height:100%;
  26. position: relative;
  27. width: 100%;
  28. }
  29. .swiper-slide .img{
  30. width: 100%;
  31. height: 100%;
  32. background-repeat: no-repeat;
  33. background-size:cover;
  34. background-position: center;
  35. }
  36. .swiper-pagination-bullet {
  37. opacity: .8;
  38. }
  39. .swiper-pagination-bullet-active {
  40. background: #d9251c;
  41. }
  42. </style>
  43. <script>
  44. (function(w, d, m) {
  45. function r() {
  46. var t = 100,
  47. o = 750,
  48. e = d.documentElement.clientWidth || w.innerWidth,
  49. n = m.max(m.min(e, 480), 320),
  50. h = 50;
  51. 320 >= n && (h = m.floor(n / o * t * .99)),
  52. n > 320 && 362 >= n && (h = m.floor(n / o * t * 1)),
  53. n > 362 && 375 >= n && (h = m.floor(n / o * t * 1)),
  54. n > 375 && (h = m.floor(n / o * t * .97)),
  55. d.querySelector("html").style.fontSize = h + "px"
  56. };
  57. r();
  58. w.onresize = function() {
  59. r()
  60. }
  61. })(window, document, Math);
  62. </script>
  63. </head>
  64. <body>
  65. <div class="swiper-container">
  66. <div class="swiper-wrapper"></div>
  67. <div class="swiper-pagination" style="font-size: 0;bottom: 22px;"></div>
  68. </div>
  69. </body>
  70. <script type="text/javascript" src="script/api.js"></script>
  71. <script type="text/javascript" src="script/swiper.min.js"></script>
  72. <script type="text/javascript" src="script/jquery.min.js"></script>
  73. <script type="text/javascript" src="script/jquery.tap.js"></script>
  74. <script type="text/javascript">
  75. var swiper = new Swiper('.swiper-container', {
  76. allowSlidePrev: true,
  77. pagination: {
  78. el: '.swiper-pagination',
  79. },
  80. });
  81. apiready = function() {
  82. getRouteData();
  83. api.addEventListener({
  84. name: 'keyback'
  85. }, function(ret, err) {
  86. api.toast({
  87. msg: '再按一次返回键退出' + api.appName,
  88. duration: 2000,
  89. location: 'bottom'
  90. });
  91. });
  92. };
  93. $(".swiper-wrapper").on("tap", "#go-to", function() {
  94. api.openWin({
  95. name: 'index',
  96. url: 'index.html',
  97. bounces: false
  98. })
  99. $api.setStorage("isSlide", "1");
  100. // setTimeout("api.closeWin();", 500);
  101. api.closeWin();
  102. return false;
  103. })
  104. function getRouteData() {
  105. $.ajax({
  106. url: siteurl + 'v2/entry/siteConfig',//'?do=getslide',
  107. data: {},
  108. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  109. dataType: 'json',
  110. type: 'post',
  111. success: function(datas) {
  112. console.log(JSON.stringify(datas.data.slide));
  113. if (datas.result) {
  114. $.each(datas.data.slide, function(index, item) {
  115. if (index == (datas.data.slide.length-1)) {
  116. <!-- $(".swiper-wrapper").append('<div class="swiper-slide" id="go-to"><img src="' + siteurl + "uploads/home/adv/" + item.adv_code + '"/></div>'); -->
  117. $(".swiper-wrapper").append('<div class="swiper-slide" id="go-to"><div class="img" style="background-image: url(' + siteurl + "uploads/home/adv/" + item.adv_code + ')"></div></div>');
  118. } else {
  119. $(".swiper-wrapper").append('<div class="swiper-slide"><div class="img" style="background-image: url(' + siteurl + "uploads/home/adv/" + item.adv_code + ')"></div></div>');
  120. // $(".swiper-wrapper").append('<div class="swiper-slide"><img src="' + siteurl + "uploads/home/adv/" + item.adv_code + '"/></div>');
  121. }
  122. });
  123. var swiper = new Swiper('.swiper-container', {
  124. allowSlidePrev: true,
  125. pagination: {
  126. el: '.swiper-pagination',
  127. },
  128. });
  129. } else {
  130. errcode(datas, datas.code);
  131. }
  132. }
  133. });
  134. }
  135. </script>
  136. </html>