<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>户外频道</title> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" /> <link rel="stylesheet" type="text/css" href="../assets/css/weui.min.css" /> <link rel="stylesheet" type="text/css" href="../assets/css/swiper-3.4.2.min.css" /> <link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_773803_1qg03k1415.css" /> <script type="text/javascript" src="../assets/font/iconfont.js"></script> <script type="text/javascript" src="../js/base.js"></script> <link rel="stylesheet" href="../css/Outdoor channel.css" /> <style type="text/css"> a{color:#000} .swiper-container { height: 3.6rem; } .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { left: 44%; } .lis .iconfont{ color:#999999; font-size: 0.5rem; } .active{ color: } </style> </head> <body> <div class="list"> <ul> <li> <a href="peripheralShort-term.html"> <div class="li_imgbox imgbox_active"><img src="../images/lu.png" alt="" /></div> <div class="zhou zhou_txt">旅行报导</div> </a> </li> <li> <a href=""> <div class="li_imgbox"><img src="../images/team.png" alt="" /></div> <div class="zhou zhou_txt">团队报导</div> </a> </li> <li> <a href=""> <div class="li_imgbox"><img src="../images/tie.png" alt="" /></div> <div class="zhou zhou_txt">技术贴</div> </a> </li> <li> <a href=""> <div class="li_imgbox"><img src="../images/zhibo.png" alt="" /></div> <div class="zhou zhou_txt">直播间</div> </a> </li> <li> <a href=""> <div class="li_imgbox"><img src="../images/luyou.png" alt="" /></div> <div class="zhou zhou_txt">人文地理</div> </a> </li> <li> <a href=""> <div class="li_imgbox"><img src="../images/sa.png" alt="" /></div> <div class="zhou zhou_txt">萨米福利</div> </a> </li> <li> <a href=""> <div class="li_imgbox"><img src="../images/deng.png" alt="" /></div> <div class="zhou zhou_txt">十级登山</div> </a> </li> <li class=''> <a href="outdoorChannel.html"> <div class="li_imgbox "><img src="../images/fei.png" alt="" /></div> <div class="zhou zhou_txt">飞机跳伞</div> </a> </li> </ul> </div> <div></div> <div class="zhou1"> 旅行报导 </div> <div class="center_mian"> <div class="picture"> <img src="../images/banner.png" alt="" /> </div> <div class="qing"> <div class="qing_out"> <span class="run"> 轻装穿越千八11峰4日行 </span> <div class="year"> <div class="act act_show"> <span class="wu"> <i class="iconfont icon-wuxing"></i> </span> <span class="txt"> 收藏 </span> </div> </div> </div> <div class="red"> <span class="circle"> </span> <span class="mon"> <span class="mon"> 阅读量100 </span> </span> </div> </div> </div> <div class="center_mian"> <div class="picture"> <img src="../images/banner.png" alt="" /> </div> <div class="qing"> <div class="qing_out"> <span class="run"> 轻装穿越千八11峰4日行 </span> <div class="year"> <div class="act act_show"> <span class="wu"> <i class="iconfont icon-wuxing"></i> </span> <span class="txt"> 收藏 </span> </div> </div> </div> <div class="red"> <span class="circle"> </span> <span class="mon"> <span class="mon"> 阅读量100 </span> </span> </div> </div> </div> <div class="center_mian"> <div class="picture"> <img src="../images/banner.png" alt="" /> </div> <div class="qing"> <div class="qing_out"> <span class="run"> 轻装穿越千八11峰4日行轻装穿越千八11峰4日行轻装穿越千八11峰4日行轻装穿越千八11峰4日行 </span> <div class="year"> <div class="act act_show"> <span class="wu"> <i class="iconfont icon-wuxing"></i> </span> <span class="txt"> 收藏 </span> </div> </div> </div> <div class="red"> <span class="circle"> </span> <span class="mon"> <span class="mon"> 阅读量100 </span> </span> </div> </div> </div> <script type="text/javascript" src="../assets/js/jquery-2.1.0.js"></script> <script type="text/javascript" src="../assets/js/swiper-3.4.2.min.js"></script> <script type="text/javascript" src="../assets/js/weui.js"></script> <!--<script type="text/javascript" src="../index.js"></script>--> <script> var mySwiper = new Swiper('.swiper-container', { pagination: '.swiper-pagination', autoplay: 1500,//可选选项,自动滑动 loop : true }) $('.act_show').click(function(event) { event.stopPropagation(); if($(this).find('.iconfont').attr('class')=='iconfont icon-wuxing'){ $(this).find('.iconfont').attr("class", "iconfont icon-shoucang"); }else{ $(this).find('.iconfont').attr("class", "iconfont icon-wuxing"); } }) $('.center_mian').click(function(){ window.location.href='advisoryDetails.html' }) $('.act_show').click(function(event) { event.stopPropagation(); }); $('.acte').click(function(event) { event.stopPropagation(); }); $('.list li div').click(function(){ $(this).css('background','#FFEEDA') }) </script> </body> </html>