為什么設置了navigation:true, 后還是不顯示導航呢。。
<!DOCTYPE html>
<html lang="en">
<head>
? ?<meta charset="UTF-8">
? ?<meat name="viewport" content="widt=device-width, initial-scale=1,user-scalable=no/">
? ? ? ?<title>quanpinggundong</title>
? ?<link rel="stylesheet" href="http://cdn.bootcss.com/fullPage.js/2.7.8/jquery.fullPage.min
? ?.css">
<style type="text/css">
body{color: #FFF;}
? ?/*#fullpageMenu{*/
? ? ? ?/*position:fixed;*/
? ? ? ?/*top:0;*/
? ? ? ?/*font-size:30px;*/
? ? ? ?/*z-index: 999;*/
? ?/*}*/
</style>
<body>
<!--<ul id="fullpageMenu">-->
? ?<!--<li data-menuanchor="page1"><a href="#page1">1section</a> </li>-->
? ?<!--<li data-menuanchor="page2"><a href="#page2">2section</a> </li>-->
? ?<!--<li data-menuanchor="page3"><a href="#page3">3section</a> </li>-->
? ?<!--<li data-menuanchor="page4"><a href="#page4">4section</a> </li>-->
? ?<!--<li data-menuanchor="page5"><a href="#page5">5section</a> </li>-->
<!--</ul>-->
<div id="fullpage">
? ?<div class="section">
? ? ? ?<h1>第一屏</h1>
? ?</div>
? ?<div class="section">
? ? ? ?<h1>第二屏</h1>
? ? ? ?<div class="slide">slide1</div>
? ? ? ?<div class="slide">slide2</div>
? ? ? ?<div class="slide">slide3</div>
? ?</div>
? ?<div class="section">
? ? ? ?<h1>第三屏</h1>
? ?</div>
? ?<div class="section">
? ? ? ?<h1>第四屏</h1>
? ?</div>
? ?<div class="section">
? ? ? ?<h1>第五屏</h1>
? ?</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.7.8/jquery.fullPage.js"></script>
<!--<script src='http://cdn.bootcss.com/jquery/1.10.1/jquery.min.js'></script>-->
<!--<script src="http://cdn.bootcss.com/fullPage.js/2.7.8/jquery.fullPage.min.js"></script>-->
<script>
$(document).ready(function(){
? ? ? ?$('#fullpage').fullpage({
? ? ? ? ? ?//verticalCentered:false,//設為false自己控制樣式,默認為true
sectionsColor:['black','yellow','red','blue','green'],//為section設置background-color屬性
anchors:['page1','page2','page3','page4','page5'],//定義錨鏈接,默認值為[]
? ? ? ? ? ?//scrollingSpeed:500,//設置頁面滾動速度,單位毫秒,默認為700
navigation:true,
navigationPosition:'right',//定義小圓點位置
navigationTooltips:['page1','page2','page3','page4','page5']//小圓點上面的提示信息
});
});
</script>
</body>
</html>
2016-10-12
我跟你的代碼寫的一樣一樣的,也是沒出來。
后來把navigation:true,改成"navigation":true,
效果就出來了,可以這么寫的原因是json字符串格式。
可是,后來,詭異的事情出現了,我把這種寫法又改回了
navigation:true,
navigationPosition:'right',
navigationTooltips:['page1','page2','page3','page4','page5']
耶正常運行了!實在詭異,作為新人,這我就解釋不了了。哈哈。一起進步!
2016-10-12
你在瀏覽器里看一下你的打印<link rel="stylesheet" href="http://cdn.bootcss.com/fullPage.js/2.7.8/jquery.fullPage.min
? ?.css">是無效的鏈接 ? 修改一下:https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.7.8/jquery.fullPage.css