frame1.html 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  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. getRouteData();
  103. });
  104. api.addEventListener({
  105. name:'resume'
  106. }, function(ret, err){
  107. $(".new-list").attr("page", "1");
  108. getRouteData();
  109. });
  110. };
  111. function getRouteData() {
  112. var _page = $(".new-list").attr("page");
  113. if ( _page == 'false' ) {
  114. return false;
  115. }
  116. $(".new-list").attr("page", "false");
  117. $.ajax({
  118. url: siteurl + 'v1/entry/news',
  119. data: {
  120. page: _page,
  121. ac_id: _acid,
  122. page_size: 10
  123. },
  124. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  125. dataType: 'json',
  126. type: 'post',
  127. success: function(datas) {
  128. // toast_loding_hide();
  129. if (datas.result) {
  130. var _html = '';
  131. $.each(datas.data.new_list, function(index, item) {
  132. _html += '<div class="h10"></div>';
  133. _html += '<div class="home-hotel-list" keyid="' + item.article_id + '"><div class="home-hotel-left"><img src="' + siteurl + "/" + item.article_thumb + '"/></div>';
  134. _html += '<div class="home-hotel-right"><div class="h2"></div>';
  135. _html += '<div class="find-list-dsc">' + item.article_title + '</div>';
  136. _html += ' <div class="find-list-time">' + item.article_time + '</div></div> </div>';
  137. });
  138. if ( _page == 1 ) {
  139. $(".new-list").html(_html);
  140. }else{
  141. $(".new-list").append(_html);
  142. }
  143. if ( datas.data.new_list.length <= 0) {
  144. $(".new-list").attr("page", "false");
  145. } else {
  146. _page++;
  147. $(".new-list").attr("page", _page);
  148. }
  149. }else{
  150. errcode(datas, datas.code)
  151. }
  152. return false;
  153. }
  154. });
  155. }
  156. function getCatogoryData() {
  157. $.ajax({
  158. url: siteurl + 'v1/entry/news_cate',
  159. data: {},
  160. headers: { "X-TOKEN": $api.getStorage("accesstoken") },
  161. dataType: 'json',
  162. type: 'post',
  163. success: function(datas) {
  164. // console.log(datas)
  165. if (datas.result) {
  166. var _html = '<div class="swiper-slide active" keyid=""><span>全部</span></div>';
  167. $.each(datas.data, function(index, item) {
  168. _html += '<div class="swiper-slide" keyid="' + item.ac_id + '"><span>' + item.ac_name + '</span></div>';
  169. });
  170. $(".swiper-wrapper").html(_html);
  171. var swiper = new Swiper('.swiper-container', {
  172. slidesPerView: 4,
  173. spaceBetween: 10,
  174. pagination: {
  175. el: '.swiper-pagination',
  176. clickable: true,
  177. },
  178. });
  179. }else{
  180. errcode(datas, datas.code)
  181. }
  182. return false;
  183. }
  184. });
  185. }
  186. $(".swiper-wrapper").on("tap", ".swiper-slide", function() {
  187. _acid = $(this).attr("keyid");
  188. $(".new-list").attr("page", "1");
  189. getRouteData();
  190. return false;
  191. })
  192. $(".new-list").on("tap", ".home-hotel-list", function() {
  193. var _keyid = $(this).attr("keyid");
  194. api.openWin({
  195. name: 'finddetails',
  196. url: './find/finddetails.html',
  197. bounces: false,
  198. pageParam: {
  199. keyid: _keyid
  200. }
  201. });
  202. return false;
  203. })
  204. /////
  205. $(".home-search").on("tap", function() {
  206. api.openWin({
  207. name: 'findsearch',
  208. url: './find/findsearch.html',
  209. bounces: false
  210. });
  211. return false;
  212. })
  213. $(".back-top").on("tap", function() {
  214. $('html , body').animate({ scrollTop: 0 }, 'slow');
  215. return false;
  216. });
  217. $.fn.fixedDiv = function(actCls) {
  218. var that = $(this),
  219. offsetTop = that.offset().top,
  220. scrollTop;
  221. function fix() {
  222. scrollTop = $(document).scrollTop();
  223. if (scrollTop > offsetTop) {
  224. that.removeClass(actCls);
  225. } else {
  226. that.addClass(actCls);
  227. }
  228. }
  229. fix();
  230. $(window).scroll(fix);
  231. }
  232. $('#fix1').fixedDiv('mask-hidden')
  233. $(".swiper-wrapper").on("tap", ".swiper-slide", function() {
  234. $(".swiper-slide").removeClass("active");
  235. $(this).addClass("active");
  236. return false;
  237. })
  238. </script>
  239. </html>