jquery.fullpage.js360安全路由全屏頁面滾動效果



140 556 186



特效描述:全屏 全屏頁面滾動 頁面滾動 頁面滾動效果,

代碼結構

1. 引入CSS

<link rel="stylesheet" href="css/jquery.fullPage.css" type="text/css" />

2. 引入JS

<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/jquery.fullPage.min.js"></script>

3. HTML代碼

<div class="scrollpage-hd">
	<div class="inner">
		<h1><a href="">360安全路由</a></h1>
		<ul class="nav">
			<li><a href="http://www.17sucai.com/">性能</a></li>
			<li><a href="http://www.17sucai.com/">智能</a></li>
			<li><a href="http://www.17sucai.com/">安全</a></li>
			<li><a href="http://www.17sucai.com/">技術規格</a></li>
			<li><a href="http://www.17sucai.com/">常見問題</a></li>
			<li><a href="http://www.17sucai.com/">固件更新</a></li>
			<li><a href="http://www.17sucai.com/">討論</a></li>
			<li><a href="http://www.17sucai.com/">下載手機客戶端</a></li>
		</ul>
	</div>
</div>
<div id="scrollpage">
	<div class="section section1">
		<a class="gojd" href="###">手機玩轉路由器——360安全路由器,更安全更智能,9月1日京東特賣開啟,GO!</a>
	</div>
	<div class="section section2">
		<div class="inner">
			<img class="img1" src="images/slider2_title.png" alt="">
			<img class="img2" src="images/slider2_phone.png" alt="">
		</div>
	</div>
	<div class="section section3">
		<div class="slide">
			<h2>超快感——業界良心打造信號穩定、速度快3倍、可穿墻的路由器</h2>
			<img src="images/slider_item0.png" alt="">
			<p class="txt">
				Wi-Fi進入千兆時代,5G雙頻路由才是新潮流。<br>
				最新的802.11ac協議,Wi-Fi速度快3倍,傳輸速率高達1167Mbps。<br>領先的MIMO
				2X2智能天線技術,信號更好、穿墻更輕松。同時支持2.4GHz和5GHz雙頻傳輸數據,可以實現<br>更快速度、傳輸更多數據,無論打游戲還是看視頻您都能獲得最佳信號。
			</p>
		</div>
		<div class="slide">
			<h2>超快感——業界良心打造信號穩定、速度快3倍、可穿墻的路由器</h2>
			<img src="images/slider_item1.png" alt="">
			<p class="txt">
				Wi-Fi進入千兆時代,5G雙頻路由才是新潮流。<br>
				最新的802.11ac協議,Wi-Fi速度快3倍,傳輸速率高達1167Mbps。<br>領先的MIMO
				2X2智能天線技術,信號更好、穿墻更輕松。同時支持2.4GHz和5GHz雙頻傳輸數據,可以實現<br>更快速度、傳輸更多數據,無論打游戲還是看視頻您都能獲得最佳信號。
			</p>
		</div>
		<div class="slide">
			<h2>超快感——業界良心打造信號穩定、速度快3倍、可穿墻的路由器</h2>
			<img src="images/slider_item2.png" alt="">
			<p class="txt">
				Wi-Fi進入千兆時代,5G雙頻路由才是新潮流。<br>
				最新的802.11ac協議,Wi-Fi速度快3倍,傳輸速率高達1167Mbps。<br>領先的MIMO
				2X2智能天線技術,信號更好、穿墻更輕松。同時支持2.4GHz和5GHz雙頻傳輸數據,可以實現<br>更快速度、傳輸更多數據,無論打游戲還是看視頻您都能獲得最佳信號。
			</p>
		</div>
		<div class="slide">
			<h2>超快感——業界良心打造信號穩定、速度快3倍、可穿墻的路由器</h2>
			<img src="images/slider_item3.png" alt="">
			<p class="txt">
				Wi-Fi進入千兆時代,5G雙頻路由才是新潮流。<br>
				最新的802.11ac協議,Wi-Fi速度快3倍,傳輸速率高達1167Mbps。<br>領先的MIMO
				2X2智能天線技術,信號更好、穿墻更輕松。同時支持2.4GHz和5GHz雙頻傳輸數據,可以實現<br>更快速度、傳輸更多數據,無論打游戲還是看視頻您都能獲得最佳信號。
			</p>
		</div>
		<div class="slide">
			<h2>超快感——業界良心打造信號穩定、速度快3倍、可穿墻的路由器</h2>
			<img src="images/slider_item4.png" alt="">
			<p class="txt">
				Wi-Fi進入千兆時代,5G雙頻路由才是新潮流。<br>
				最新的802.11ac協議,Wi-Fi速度快3倍,傳輸速率高達1167Mbps。<br>領先的MIMO
				2X2智能天線技術,信號更好、穿墻更輕松。同時支持2.4GHz和5GHz雙頻傳輸數據,可以實現<br>更快速度、傳輸更多數據,無論打游戲還是看視頻您都能獲得最佳信號。
			</p>
		</div>
	</div>
	<div class="section section4">
		<div class="inner">
			<img class="img1" src="images/slider4_bg.jpg" alt="">
			<div class="txt">
				<h2></h2>
				<p>顛覆傳統路由的繁瑣設置,用手機就能搞定一切!您可以通過遠程操控,隨時為父母解決網絡問題。信號強度可調,輻射可控,為寶寶和孕婦等家人提供健康的上網環境。愛搗鼓的Geek,想要玩轉路由,您有太多新技能需get√,萬能中繼、自定義host、無限擴展的插件中心……</p>
				<div class="icon"></div>
				<p>? 功率可調節輻射可控 ? 設備限速 ? 一鍵優化信號 ? 訪客免密碼上網 ? 秒踢蹭網者</p>
			</div>
		</div>
	</div>
	<div class="section section5">
		<div class="inner">
			<img class="img1" src="images/slider5_bg.gif" alt="">
			<div class="txt">
				<h2></h2>
				<p>全民網絡時代來臨,路由器作為各種上網設備聯網的第一道關口,更加需要全方位的安全防護。360首創sOS路由器安全系統,一鍵就能開啟“Wi-Fi防盜門“,實時查殺全球最新的病毒、木馬和惡意DNS數據,讓家中每一臺上網設備都可以安心暢游網絡。</p>
				<img class="icon" src="images/slider5_icon1.png" alt="">
				<img class="icon" src="images/slider5_icon2.png" alt="">
				<img class="icon" src="images/slider5_icon3.png" alt="">
			</div>
			<div class="ft">
				<div class="ft-link">
					<div class="more-links first">
						<h3>幫助</h3>
						<ul>
							<li><a href="">反饋建議</a></li>
						</ul>
					</div>
					<div class="more-links">
						<h3>關注我們</h3>
						<ul>
							<li><a href="">官方論壇</a></li>
							<li><a href="">官方微博</a></li>
							<li><a href="">官方微信</a></li>
						</ul>
					</div>
					<div class="more-links">
						<h3>相關網站</h3>
						<ul>
							<li><a href="">360硬件專區</a></li>
							<li><a href="">360兒童衛士</a></li>
							<li><a href="">360防丟衛士</a></li>
						</ul>
					</div>
					<div class="service">
						<ul>
							<li class="phone">400-6822-360</li>
							<li class="time">周一至周日9:00-18:00</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
$(function(){
	$('#scrollpage').fullpage({
		navigation: true
	});
});
</script>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 滾動 滾動條 頁面滾動 滾動插件 滾動條插件 滾動條美化 自動滾動圖片輪播 全屏焦點圖 全屏切換 寬屏全屏 寬屏 全屏 頁面全屏 頁面寬屏 圖片全屏 滾動切換 滾動條切換
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子