outdoorChannel.html 5.8 KB
<!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>