                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /FullPage.js全屏滾動插件

為什么在menu中沒通過JQuery綁定，仍能顯示。

<!doctype?html>
<html>
<head>
<meta?charset="utf-8">
<title>fullpage_test</title>
<link?rel="stylesheet"?>
<style?>
body?{
	text-align:?center;
	font-size:?12px;
	color:?white;
}
/*.section1?{
	background-color:?orange;
	text-align:?center;
}
.section2?{
	background-color:?red;
	text-align:?center;
}
.section3?{
	background-color:?green;
	text-align:?center;
}
.section4?{
	background-color:?gray;
	text-align:?center;
}
.section5?{
	background-color:?black;
	text-align:?center;
}
.slide{
	
	background-color:pink;}*/
	
#header?{
	font-size:?50px;
	position:?fixed;
	top:?0;
	right:?50px;
}
#fullpageMenu{
	font-size:20px;
	position:fixed;
	top:50px;
	z-index:999;
	list-style-type:none;
	}
#fullpageMenu?a{
	text-align:left;
	text-decoration:none;}
#fullpageMenu?a:hover{
	color:#FFF;
	}	
</style>
</head>
<body>
<div?id="header">header</div>
<ul?id="fullpageMenu">
??<li?data-menuanchor="page1"?class="active"><a?href="#page1">page1</a></li>
??<li?data-menuanchor="page2"><a?href="#page2">page2</a></li>
??<li?data-menuanchor="page3"><a?href="#page3">page3</a></li>
??<li?data-menuanchor="page4"><a?href="#page4">page4</a></li>
??<li?data-menuanchor="page5"><a?href="#page5">page5</a></li>

</ul>
<div?id="fullpage">
??<div?class="section?">
????<h1>?first?page</h1>
??</div>
??<div?class="section?section2">
????<div?class="slide?slide1">slide1</div>
????<div?class="slide">slide1</div>
????<div?class="slide">slide1</div>
????<div?class="slide">slide1</div>
????<div?class="slide">slide1</div>
??</div>
??<div?class="section?section3">
????<h1>third?page</h1>
??</div>
??<div?class="section?section4">
????<h1>?forth?page</h1>
??</div>
??<div?class="section?section5">
????<h1>?fifth?page</h1>
??</div>
</div>
<script?src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.js">
</script>?
<script?src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.7.4/jquery.fullPage.js">
</script>?
<script>
$(document).ready(function(){
	$('#fullpage').fullpage({
		sectionsColor:['red','blue','yellow','pink','black'],
		//resize:false,
		//scrollingSpeed:2000,???//滾動時間，2000就是兩秒
		anchors:['page1','page2','page3','page4','page5'],/*設置錨鏈接?主要是在收藏某一頁的時候，當再次打開的時候，它不會由第一頁滑到這一頁，而是直接出現(xiàn)這一頁*/
		?//?lockAnchors:true,/*鎖定錨節(jié)點*/
		//loopTop:true,?????????????/*?頂部循環(huán)滾動是跳往底部的頁面*/
		??/*??loopBottom:true,?????????????底部循環(huán)滾動，同樣是跳往頁面
		??loopHorizontal:false,????????幻燈片循環(huán)滾動
		*/
		//autoscrolling：true,?????????/*頁面不會按照插件的滾動方式滾動，而是按照滾動條的滾動方式滾動*/
		?//scrollBar:true,???????	??/*此設置項為true，則會出現(xiàn)滾動條但還是按照插件的滾動方式*/
		fixedElements:'#header',???????//設置某一元素固定于某一位置，通過JQuary捕捉定位到某一元素（如這個實例中的header）
		//continuousVertical:true,?????/*循環(huán)滾動，與loopTop和loopBottom不兼容，不能同時設置，經(jīng)測試如果同時設置則會有l(wèi)ooopTop或者loopBottom的效果*/
		//menu:'#fullpageMenu',??????//為菜單選項，在前面的ul中要把錨鏈接相應的鏈接起來。
		
		});??
		
});
</script>
</body>
</html>