frame1.html 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251
  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>
  8. <link rel="stylesheet" type="text/css" href="../css/api.css" />
  9. <link rel="stylesheet" type="text/css" href="../css/border.css" />
  10. <link rel="stylesheet" type="text/css" href="../css/reset.css" />
  11. <link rel="stylesheet" type="text/css" href="../css/weui.min.css" />
  12. <link rel="stylesheet" type="text/css" href="../css/swiper.min.css" />
  13. <link rel="stylesheet" type="text/css" href="../css/style.css" />
  14. <style>
  15. .swiper-container {
  16. width: 100%;
  17. height: 100%;
  18. }
  19. .swiper-container{
  20. width: 100%;
  21. height: 0.5rem;
  22. }
  23. .swiper-slide{
  24. text-align: center;
  25. line-height: 0.5rem;
  26. font-size: 0.28rem;
  27. }
  28. .active, .active span{
  29. color: #d9251c;
  30. }
  31. .active span {
  32. border-bottom: 0.1em solid;
  33. }
  34. .white-back {
  35. position: fixed;
  36. z-index: 1;
  37. top: 0;
  38. left: 0;
  39. right: 0;
  40. padding: 0 0.2rem;
  41. }
  42. .new-list{
  43. margin-top: 1.3rem;
  44. }
  45. </style>
  46. <script>
  47. (function(w, d, m) {
  48. function r() {
  49. var t = 100,
  50. o = 750,
  51. e = d.documentElement.clientWidth || w.innerWidth,
  52. n = m.max(m.min(e, 480), 320),
  53. h = 50;
  54. 320 >= n && (h = m.floor(n / o * t * .99)),
  55. n > 320 && 362 >= n && (h = m.floor(n / o * t * 1)),
  56. n > 362 && 375 >= n && (h = m.floor(n / o * t * 1)),
  57. n > 375 && (h = m.floor(n / o * t * .97)),
  58. d.querySelector("html").style.fontSize = h + "px"
  59. };
  60. r();
  61. w.onresize = function() {
  62. r()
  63. }
  64. })(window, document, Math);
  65. </script>
  66. </head>
  67. <body id="viewport">
  68. <div class="topbar"></div>
  69. <div class="white-back" id="header">
  70. <div class="home-search">
  71. <img src="../image/search.png"> 搜索文章
  72. </div>
  73. <div style="padding-top: 0.2rem;">
  74. <div class="swiper-container" style="padding-bottom: 0.1em;">
  75. <div class="swiper-wrapper"></div>
  76. </div>
  77. </div>
  78. </div>
  79. <section class="new-list" page="1" style="padding-top: 0rem;"></section>
  80. <div class="back-top mask-hidden" id="fix1"></div>
  81. </body>
  82. <script type="text/javascript" src="../script/api.js"></script>
  83. <script type="text/javascript" src="../script/swiper.min.js"></script>
  84. <script type="text/javascript" src="../script/jquery.min.js"></script>
  85. <script type="text/javascript" src="../script/jquery.tap.js"></script>
  86. <script type="text/javascript">
  87. var _acid = '';
  88. var _minid = 1;
  89. apiready = function() {
  90. var $header = $api.byId('header');
  91. $api.fixIos7Bar($header);
  92. $api.fixStatusBar($header);
  93. setIosTopBar();
  94. getCatogoryData();
  95. getRouteData();
  96. api.addEventListener({
  97. name: 'scrolltobottom',
  98. extra: {
  99. threshold: 200
  100. }
  101. }, function(ret, err) {
  102. console.log(ret);
  103. getRouteData();
  104. });
  105. api.addEventListener({
  106. name:'resume'
  107. }, function(ret, err){
  108. $(".new-list").attr("page", "1");
  109. getRouteData();
  110. });
  111. };
  112. function getRouteData() {
  113. var _page = $(".new-list").attr("page");
  114. if ( _page == 'false' ) {
  115. return false;
  116. }
  117. $(".new-list").attr("page", "false");
  118. $.ajax({
  119. url: siteurl + 'v1/entry/news',
  120. data: {
  121. page: _page,
  122. ac_id: _acid,
  123. page_size: 10
  124. },
  125. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  126. dataType: 'json',
  127. type: 'post',
  128. success: function(datas) {
  129. // toast_loding_hide();
  130. if (datas.result) {
  131. var _html = '';
  132. $.each(datas.data.new_list, function(index, item) {
  133. _html += '<div class="h10"></div>';
  134. _html += '<div class="home-hotel-list" keyid="' + item.article_id + '"><div class="home-hotel-left"><img src="' + siteurl + "/" + item.article_thumb + '"/></div>';
  135. _html += '<div class="home-hotel-right"><div class="h2"></div>';
  136. _html += '<div class="find-list-dsc">' + item.article_title + '</div>';
  137. _html += ' <div class="find-list-time">' + item.article_time + '</div></div> </div>';
  138. });
  139. if ( _page == 1 ) {
  140. $(".new-list").html(_html);
  141. }else{
  142. $(".new-list").append(_html);
  143. }
  144. if ( datas.data.new_list.length <= 0) {
  145. $(".new-list").attr("page", "false");
  146. } else {
  147. _page++;
  148. $(".new-list").attr("page", _page);
  149. }
  150. }else{
  151. errcode(datas, datas.code)
  152. }
  153. return false;
  154. }
  155. });
  156. }
  157. function getCatogoryData() {
  158. $.ajax({
  159. url: siteurl + 'v1/entry/news_cate',
  160. data: {},
  161. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  162. dataType: 'json',
  163. type: 'post',
  164. success: function(datas) {
  165. // console.log(datas)
  166. if (datas.result) {
  167. var _html = '<div class="swiper-slide active" keyid=""><span>全部</span></div>';
  168. $.each(datas.data, function(index, item) {
  169. _html += '<div class="swiper-slide" keyid="' + item.ac_id + '"><span>' + item.ac_name + '</span></div>';
  170. });
  171. $(".swiper-wrapper").html(_html);
  172. var swiper = new Swiper('.swiper-container', {
  173. slidesPerView: 4,
  174. spaceBetween: 10,
  175. pagination: {
  176. el: '.swiper-pagination',
  177. clickable: true,
  178. },
  179. });
  180. }else{
  181. errcode(datas, datas.code)
  182. }
  183. return false;
  184. }
  185. });
  186. }
  187. $(".swiper-wrapper").on("tap", ".swiper-slide", function() {
  188. _acid = $(this).attr("keyid");
  189. $(".new-list").attr("page", "1");
  190. getRouteData();
  191. return false;
  192. })
  193. $(".new-list").on("tap", ".home-hotel-list", function() {
  194. var _keyid = $(this).attr("keyid");
  195. api.openWin({
  196. name: 'finddetails',
  197. url: './find/finddetails.html',
  198. bounces: false,
  199. pageParam: {
  200. keyid: _keyid
  201. }
  202. });
  203. return false;
  204. })
  205. /////
  206. $(".home-search").on("tap", function() {
  207. api.openWin({
  208. name: 'findsearch',
  209. url: './find/findsearch.html',
  210. bounces: false
  211. });
  212. return false;
  213. })
  214. $(".back-top").on("tap", function() {
  215. $('html , body').animate({ scrollTop: 0 }, 'slow');
  216. return false;
  217. });
  218. $.fn.fixedDiv = function(actCls) {
  219. var that = $(this),
  220. offsetTop = that.offset().top,
  221. scrollTop;
  222. function fix() {
  223. scrollTop = $(document).scrollTop();
  224. if (scrollTop > offsetTop) {
  225. that.removeClass(actCls);
  226. } else {
  227. that.addClass(actCls);
  228. }
  229. }
  230. fix();
  231. $(window).scroll(fix);
  232. }
  233. $('#fix1').fixedDiv('mask-hidden')
  234. $(".swiper-wrapper").on("tap", ".swiper-slide", function() {
  235. $(".swiper-slide").removeClass("active");
  236. $(this).addClass("active");
  237. return false;
  238. })
  239. </script>
  240. </html>