slide.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  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-container {
  15. width: 100%;
  16. height: 100%;
  17. }
  18. .swiper-slide {
  19. text-align: center;
  20. font-size: 18px;
  21. background: #ffffff;
  22. height:100%;
  23. position: relative;
  24. }
  25. .swiper-slide img{
  26. width:100%;
  27. display: block;
  28. position: absolute;
  29. /*left:50%;top:50%;*/
  30. /*transform: translate(-50%,-50%);*/
  31. }
  32. .swiper-pagination-bullet {
  33. opacity: .8;
  34. }
  35. .swiper-pagination-bullet-active {
  36. background: #d9251c;
  37. }
  38. </style>
  39. <script>
  40. (function(w, d, m) {
  41. function r() {
  42. var t = 100,
  43. o = 750,
  44. e = d.documentElement.clientWidth || w.innerWidth,
  45. n = m.max(m.min(e, 480), 320),
  46. h = 50;
  47. 320 >= n && (h = m.floor(n / o * t * .99)),
  48. n > 320 && 362 >= n && (h = m.floor(n / o * t * 1)),
  49. n > 362 && 375 >= n && (h = m.floor(n / o * t * 1)),
  50. n > 375 && (h = m.floor(n / o * t * .97)),
  51. d.querySelector("html").style.fontSize = h + "px"
  52. };
  53. r();
  54. w.onresize = function() {
  55. r()
  56. }
  57. })(window, document, Math);
  58. </script>
  59. </head>
  60. <body>
  61. <div class="swiper-container">
  62. <div class="swiper-wrapper"></div>
  63. <div class="swiper-pagination" style="font-size: 0;bottom: 22px;"></div>
  64. </div>
  65. </body>
  66. <script type="text/javascript" src="script/api.js"></script>
  67. <script type="text/javascript" src="script/swiper.min.js"></script>
  68. <script type="text/javascript" src="script/jquery.min.js"></script>
  69. <script type="text/javascript" src="script/jquery.tap.js"></script>
  70. <script type="text/javascript">
  71. apiready = function() {
  72. getRouteData();
  73. api.addEventListener({
  74. name: 'keyback'
  75. }, function(ret, err) {
  76. api.toast({
  77. msg: '再按一次返回键退出' + api.appName,
  78. duration: 2000,
  79. location: 'bottom'
  80. });
  81. });
  82. };
  83. $(".swiper-wrapper").on("tap", "#go-to", function() {
  84. api.openWin({
  85. name: 'index',
  86. url: 'index.html',
  87. bounces: false
  88. })
  89. $api.setStorage("isSlide", "1");
  90. // setTimeout("api.closeWin();", 500);
  91. api.closeWin();
  92. return false;
  93. })
  94. function getRouteData() {
  95. $.ajax({
  96. url: siteurl + 'v2/entry/siteConfig',//'?do=getslide',
  97. data: {},
  98. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  99. dataType: 'json',
  100. type: 'post',
  101. success: function(datas) {
  102. console.log(JSON.stringify(datas.data.slide));
  103. if (datas.result) {
  104. $.each(datas.data.slide, function(index, item) {
  105. if (index == (datas.data.slide.length-1)) {
  106. $(".swiper-wrapper").append('<div class="swiper-slide" id="go-to"><img src="' + siteurl + "uploads/home/adv/" + item.adv_code + '"/></div>');
  107. } else {
  108. $(".swiper-wrapper").append('<div class="swiper-slide"><img src="' + siteurl + "uploads/home/adv/" + item.adv_code + '"/></div>');
  109. }
  110. });
  111. var swiper = new Swiper('.swiper-container', {
  112. allowSlidePrev: true,
  113. pagination: {
  114. el: '.swiper-pagination',
  115. },
  116. });
  117. } else {
  118. errcode(datas, datas.code);
  119. }
  120. }
  121. });
  122. }
  123. </script>
  124. </html>