商丘市柘城县——前端

morePhotos.html 6.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>更多图片展示</title>
  6. <meta http-equiv="x-ua-compatible" content="ie=edge">
  7. <link rel="stylesheet" href="css/bootstrap.min.css" />
  8. <link rel="stylesheet" href="css/indexs.css" />
  9. <!--[if lt IE 9]>
  10. <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
  11. <script src="http://apps.bdimg.com/libs/respond.js/1.4.2/respond.min.js"></script>
  12. <![endif]-->
  13. <style>
  14. .img_box {
  15. margin: 0 -1%;
  16. margin-top: -2%;
  17. }
  18. .img_box li {
  19. float: left;
  20. width: 24%;
  21. margin-left: 1%;
  22. margin-top: 2%;
  23. }
  24. .img_box li a {
  25. display: block;
  26. width: 100%;
  27. }
  28. .img_box li img {
  29. /*display:block;*/
  30. width: 252px;
  31. height: 165px;
  32. margin: 0 auto;
  33. }
  34. .box-01.red-decoration .main-content .content-text {
  35. margin: 15px 0px;
  36. }
  37. </style>
  38. </head>
  39. <body>
  40. <div class="topbar">
  41. <div class="container">
  42. <ul class="fl">
  43. <li>
  44. <a href="#" target="_self">柘城县12345政府服务热线</a>
  45. </li>
  46. </ul>
  47. <ul class="rl Right_f">
  48. <li>
  49. <a href="http://61.163.183.173:8888/login.html">管理登录</a>
  50. </li>
  51. <li>
  52. <span class="text-muted">|</span>
  53. </li>
  54. <li>
  55. <a href="javascript:;" class="topbarWx">
  56. <img src="img/wechat.png" alt="微信logo" /> 微信公众号
  57. <div class="topbarWx-box">
  58. <i class="topbarWx-code"></i>
  59. <span>微信扫码,关注我们</span>
  60. </div>
  61. </a>
  62. </li>
  63. <li>
  64. <span class="text-muted">|</span>
  65. </li>
  66. <li>
  67. <a href="javascript:;" class="topbarClient">
  68. <img src="img/phone.png" alt="移动客户端logo" /> 移动客户端
  69. <div class="topbarClient-box">
  70. <input id="elevator-app-url0" type="text" value="" style="display: none;" />
  71. <div id="elevator-app-qrcode0"></div>
  72. <span class="">扫码下载,使用客户端</span>
  73. </div>
  74. </a>
  75. </li>
  76. </ul>
  77. </div>
  78. </div>
  79. <section>
  80. <div class="ban_title">
  81. <img src="img/banner.png" alt="图片" />
  82. </div>
  83. </section>
  84. <!--导航-->
  85. <div class="navcon shadow">
  86. <div class="navcon_box clearfix">
  87. <ul class="nav ">
  88. <div class="fl ban-border"></div>
  89. <li class="actives ">
  90. <a href="index.html" target="_self" class="clearfix">
  91. <div class="fl ban-img">
  92. <img src="img/a1.png" alt="" />
  93. </div>
  94. <div class=" Baner-pos">
  95. <p>网站首页</p>
  96. </div>
  97. </a>
  98. </li>
  99. <div class="fl ban-border"></div>
  100. <li>
  101. <a href="zhengce.html" target="_self">
  102. <div class="fl ban-img">
  103. <img src="img/a2.png" alt="" />
  104. </div>
  105. <div class=" Baner-pos">
  106. <p>政策要闻</p>
  107. </div>
  108. </a>
  109. </li>
  110. <div class="fl ban-border"></div>
  111. <li>
  112. <a href="dongtai.html" target="_self">
  113. <div class="fl ban-img">
  114. <img src="img/a3.png" alt="" />
  115. </div>
  116. <div class=" Baner-pos">
  117. <p>工作动态</p>
  118. </div>
  119. </a>
  120. </li>
  121. <div class="fl ban-border"></div>
  122. <li>
  123. <a href="baoguang.html" target="_self">
  124. <div class="fl ban-img">
  125. <img src="img/a4.png" alt="" />
  126. </div>
  127. <div class=" Baner-pos">
  128. <p>便民信息</p>
  129. </div>
  130. </a>
  131. </li>
  132. <div class="fl ban-border"></div>
  133. <li>
  134. <a href="tousu.html" target="_self">
  135. <div class="fl ban-img">
  136. <img src="img/a5.png" alt="" />
  137. </div>
  138. <div class=" Baner-pos">
  139. <p>网上受理</p>
  140. </div>
  141. </a>
  142. </li>
  143. <div class="fl ban-border"></div>
  144. <li>
  145. <a href="shouli.html" target="_self">
  146. <div class="fl ban-img">
  147. <img src="img/a6.png" alt="" />
  148. </div>
  149. <div class=" Baner-pos">
  150. <p>网上查询</p>
  151. </div>
  152. </a>
  153. </li>
  154. <div class="fl ban-border"></div>
  155. </ul>
  156. </div>
  157. </div>
  158. <!--内容-->
  159. <div class="Content">
  160. <div>
  161. <div class="navcon_box clearfix navCon">
  162. <div class="main-wrap main-body">
  163. <div class="box-01 red-decoration">
  164. <div class="box-title">
  165. <div class="box-title-name">
  166. <ol class="breadcrumb">
  167. <li>
  168. <a href="index.html">首页</a>
  169. </li>
  170. <li class="active">全部照片展示</li>
  171. </ol>
  172. </div>
  173. </div>
  174. <div class="main-content">
  175. <div class="content-text">
  176. <div class="news_content_content">
  177. <ul class="img_box clearfix">
  178. </ul>
  179. </div>
  180. </div>
  181. </div>
  182. </div>
  183. </div>
  184. </div>
  185. </div>
  186. </div>
  187. <!--底部开始-->
  188. <div class="footer">
  189. <div class="navcon_box footerbox ">
  190. <div>Copyright &copy;2017 柘城县12345县长热线版权所有 All Rights Reserved.</div>
  191. <div>备案号:
  192. <a href="http://www.miitbeian.gov.cn/" target="_blank" rel="nofollow">豫ICP备19004932号</a>
  193. </div>
  194. </div>
  195. </div>
  196. <script src="js/jquery.min.js"></script>
  197. <script src="js/common/huayi.config.js"></script>
  198. <script src="js/common/huayi.http.js"></script>
  199. <script src="js/qrcode.min.js"></script>
  200. <script src="js/getClient.js"></script>
  201. <script>
  202. IMG()
  203. //走进柘城县图片
  204. function IMG() {
  205. $.post(huayi.config.callcenter_url + "Web/GetTopNewsList", {
  206. type: 5,
  207. num: 8
  208. }, function(result) {
  209. result = JSON.parse(result);
  210. var content = result.data;
  211. //console.log(content);
  212. for(var i = 0; i < content.length; i++) {
  213. var a_ = 'img/meilihebi.png';
  214. var a = content[i].img;
  215. if(a) {
  216. } else {
  217. a = a_;
  218. }
  219. //debugger;
  220. $('<li>' +
  221. // '<div class="_imgbox clearfix">' +
  222. '<a href="ShowImg.html?id=' + content[i].id + '" title="' + content[i].bt + '"><img src="' + a + '" /></a>' +
  223. // '</div>' +
  224. // '<div>' +
  225. '<a class="s-14 new_imga">' + content[i].nr + '</a>' +
  226. // '</div>' +
  227. '</li>')
  228. .appendTo(".img_box");
  229. }
  230. })
  231. }
  232. //getClient();
  233. //获取客户端地址并转成二维码
  234. //顶部hover
  235. $('.topbarWx').hover(function() {
  236. $('.topbarWx .topbarWx-box').css('left', $(this).offset().left);
  237. });
  238. $('.topbarClient').hover(function() {
  239. $('.topbarClient .topbarClient-box').css('left', $(this).offset().left);
  240. });
  241. </script>
  242. </body>
  243. </html>