<address id="jzxfj"></address>

<noframes id="jzxfj"><form id="jzxfj"><nobr id="jzxfj"></nobr></form>
<listing id="jzxfj"><listing id="jzxfj"></listing></listing>

<form id="jzxfj"><th id="jzxfj"><th id="jzxfj"></th></th></form>

<form id="jzxfj"></form>

    [科技]基于html5海賊王單頁視差滾動特效

      分享一款基于html5海賊王單頁視差滾動特效是一款流行滑落網頁特效代碼。效果圖如下:

      實現的代碼:

     <div class="top">
            <div class="top_main center">
                <ul id="scene" class="scene">
                    <li class="layer" data-depth="0.10">
                        <img class=" top_img02" src="images/top_img03.png"></li>
                    <li class="layer" data-depth="0.40">
                        <img class=" top_img04" src="images/top_img04.png"></li>
                    <li class="layer" data-depth="0.60">
                        <img class=" top_img05" src="images/top_img05.png"></li>
                    <li class="layer" data-depth="0.90">
                        <img class=" top_img06" src="images/top_img06.png"></li>
                    <li class="layer" data-depth="0.20">
                        <img class=" top_img07" src="images/top_img04.png"></li>
                    <li class="layer" data-depth="0.60">
                        <img class=" top_img08" src="images/top_img05.png"></li>
                    <li class="layer" data-depth="0.40">
                        <img class=" top_img09" src="images/top_img06.png"></li>
                    <li class="layer" data-depth="0.10">
                        <img class=" top_img10" src="images/top_img05.png"></li>
                    <li class="layer" data-depth="0.60">
                        <img class=" top_img11" src="images/top_img06.png"></li>
                    <li class="layer" data-depth="0.50">
                        <img class=" top_img12" src="images/top_img04.png"></li>
                    <li class="layer" data-depth="0.40">
                        <img class=" top_img13" src="images/top_img04.png"></li>
                    <li class="layer" data-depth="0.20">
                        <img class=" top_img14" src="images/top_img06.png"></li>
                    <li class="layer" data-depth="0.10">
                        <img class=" top_img15" src="images/top_img05.png"></li>
                </ul>
                <img class="lx01" src="images/lx01.png">
                <img class="lx02" src="images/lx02.png">
                <img class="lx03" src="images/lx03.png">
                <img class="lx04" src="images/lx02.png">
                <img class="lx05" src="images/lx03.png">
            </div>
            <!-- top_main end -->
        </div>
        <!-- top end -->
        <div class="section1">
            <div class="sec_c1">
                <h1>
                    關于海賊王</h1>
                <hr style="border: 3 double #987cb9; margin-bottom: 40px; box-shadow: 0 0 5px yellow"
                    width="100%" color="yellow" size="3;">
                <p>
                    航海王(日本尾田榮一郎創作的漫畫)</p>
                <p>
                    擁有財富、名聲、權力,這世界上的一切的男人 “海賊王”哥爾·D·羅杰,在被行刑受死之前說了一句話,讓全世界的人都涌向了大海?!跋胍业膶毑貑??如果想要的話,那就到海上去找吧,我全部都放在那里?!?,世界開始迎接“大海賊時代”的來臨。</p>
                <p>
                    時值“大海賊時代”,為了尋找傳說中海賊王羅杰所留下的大秘寶“ONE PIECE”,無數海賊揚起旗幟,互相爭斗。一個叫路飛的少年為了與因救他而斷臂的香克斯的約定而出海,在旅途中不斷尋找志同道合的伙伴,開始了以成為海賊王為目標的偉大冒險旅程</p>
            </div>
        </div>
        <!-- <div class="section2">
    	<div class="sec_c2">
    		<h1>人生中有些事你不竭盡所能去做,你永遠不知道你自己有多出色 。</h1>
    		<p>by.海賊王</p>
    	</div>
    </div> -->
        <!-- section2 end  -->
        <div class="section3">
            <div id="carousel_container" class="carousel slide full_height">
                <div class="carousel-inner full_height">
                    <div id="m_01" class="page item active" progress="150">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【船長】“草帽”蒙奇·D·路飛(蒙其·D·魯夫)(モンキーD·ルフィ/Monkey D. Luffy)</p>
                                    <p>
                                        年齡:17歲→19歲(漫畫598話開始的“兩年后”)</p>
                                    <p>
                                        生日:5月5日(日本男孩節)</p>
                                    <p>
                                        星座:金牛座</p>
                                    <p>
                                        身高:172cm,174cm(兩年后)</p>
                                    <p>
                                        故鄉:東海風車村</p>
                                    <p>
                                        身份:草帽海賊團船長/草帽團三主力之一</p>
                                    <p>
                                        喜歡的食物:肉</p>
                                    <p>
                                        愛好:喜歡探險,感興趣于新奇怪異的事物</p>
                                    <p>
                                        身世:革命家蒙奇·D·龍的兒子,海軍中將蒙奇·D·卡普的孫子,波特卡斯·D·艾斯及薩博的義弟。</p>
                                    <p>
                                        惡魔果實:超人系橡膠果實</p>
                                    <p>
                                        霸氣:霸王色霸氣、武裝色霸氣、見聞色霸氣</p>
                                    <p>
                                        懸賞:3千萬(可可亞西村事件)→1億(阿拉巴斯坦事件)→3億(司法島事件)→4億(頂上戰爭后)</p>
                                    <p>
                                        聲優:田中真弓</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <!-- lufi end -->
                    <div id="m_02" class="page item" progress="300">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【戰斗員】“海賊獵人”羅羅諾亞·索?。_諾亞·卓洛/羅羅諾亞·佐羅)(ロロノア·ゾロ/Roronoa Zoro)</p>
                                    <p>
                                        年齡:19歲→21歲(漫畫598話開始的“兩年后”)</p>
                                    <p>
                                        生日:11月11日</p>
                                    <p>
                                        星座:天蝎座</p>
                                    <p>
                                        身高:178cm,181cm(兩年后)</p>
                                    <p>
                                        故鄉:東海 霜月村</p>
                                    <p>
                                        身份:草帽海賊團劍士/草帽團三主力之一/海賊獵人</p>
                                    <p>
                                        喜歡的食物:白米,海獸的肉,適合下酒的食物</p>
                                    <p>
                                        愛好:睡覺、修煉、喝酒。</p>
                                    <p>
                                        缺點:路癡</p>
                                    <p>
                                        霸氣:武裝色霸氣、見聞色霸氣</p>
                                    <p>
                                        武器:和道一文字(古伊娜的刀)、雪走(在司法島上被吃了銹銹果實的上校銹斷了)、三代鬼徹、黑刀秋水(與武士龍馬戰斗后得到)</p>
                                    <p>
                                        懸賞:6千萬(阿拉巴斯坦事件)→1億2000萬(司法島事件)</p>
                                    <p>
                                        聲優:中井和哉</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <div id="m_03" class="page item" progress="450">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【航海士】“小賊貓”娜美(奈美)(ナミ/Nami)</p>
                                    <p>
                                        年齡:18歲→20歲(漫畫598話開始的“兩年后”)</p>
                                    <p>
                                        生日:7月3日</p>
                                    <p>
                                        星座:巨蟹座</p>
                                    <p>
                                        身高:169cm,170cm(兩年后)</p>
                                    <p>
                                        故鄉:東??煽蓙單鞔?lt;/p>
                                    <p>
                                        身份:草帽海賊團航海士</p>
                                    <p>
                                        喜歡的食物:都不錯,但最喜歡橘子</p>
                                    <p>
                                        愛好:錢,橘子,風車,地圖</p>
                                    <p>
                                        特長:繪制地圖,觀測天氣,偷東西</p>
                                    <p>
                                        武器:三截式長棍→天候棒→完全版天候棒(由烏索普所發明)→魔法天候棒(由氣象島學者改良)</p>
                                    <p>
                                        懸賞:1600萬(司法島事件)</p>
                                    <p>
                                        聲優:岡村明美</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <div id="m_04" class="page item" progress="600">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【狙擊手】烏索普(騙人布/烏索布)(ウソップ/Usopp)</p>
                                    <p>
                                        年齡:17歲→19歲 (漫畫598話開始的“兩年后”)</p>
                                    <p>
                                        生日:4月1日</p>
                                    <p>
                                        星座:白羊座</p>
                                    <p>
                                        身高:174cm,176cm(兩年后)</p>
                                    <p>
                                        故鄉:東海 西羅普村</p>
                                    <p>
                                        身份:烏索普海賊團船長→草帽海賊團狙擊手</p>
                                    <p>
                                        喜歡的食物:秋島的秋刀魚,旺季的魚類</p>
                                    <p>
                                        愛好:發明各種東西、制造武器</p>
                                    <p>
                                        霸氣:見聞色霸氣</p>
                                    <p>
                                        綽號:狙擊王、長鼻子</p>
                                    <p>
                                        武器:彈弓、橡皮筋、鐵錘、大獨角仙(巨型彈弓)、“狙擊王”的面具 、黒兜(魚人島龍宮國戰斗使用</p>
                                    <p>
                                        懸賞:3000萬(以“狙擊王”的身份在司法島事件中)</p>
                                    <p>
                                        聲優:山口勝平</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <div id="m_05" class="page item" progress="750">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【廚師】“黑足”山治(香吉士/香吉/山智)(サンジ/Sanji)</p>
                                    <p>
                                        年齡:19歲→21歲(兩年后)</p>
                                    <p>
                                        生日:3月2日 (TV版為3月4日)</p>
                                    <p>
                                        星座:雙魚座</p>
                                    <p>
                                        身高:177cm,180cm(兩年后)</p>
                                    <p>
                                        故鄉:北海</p>
                                    <p>
                                        身份:草帽海賊團廚師/草帽團三主力之一</p>
                                    <p>
                                        喜歡的食物:辣味海鮮面,適合紅茶的食物</p>
                                    <p>
                                        愛好:下廚,抽煙,浪漫幻想</p>
                                    <p>
                                        能力:腳技、刀法、烹飪、月步</p>
                                    <p>
                                        霸氣:見聞色霸氣、武裝色霸氣</p>
                                    <p>
                                        綽號:白癡卷眉、廚子、色情廚子、鼻血廚師、海賊A(索隆所?。?,圈圈眉,褶子靚卷眉,好色河童,7號(在兩年后肥皂泡群島索隆叫的 指到集中地點的先后順序,索隆取的),黑足</p>
                                    <p>
                                        懸賞:7700萬(司法島事件)</p>
                                    <p>
                                        聲優:平田廣明/大谷育江(小時候)</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <div id="m_06" class="page item" progress="900">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【船醫】“愛吃棉花糖的馴鹿”托尼托尼·喬巴(多尼多尼·喬巴)(トニートニーチョッパー/Tony Tony Chopper)</p>
                                    <p>
                                        年齡:15歲→17歲(漫畫598話開始的“兩年后”)</p>
                                    <p>
                                        生日:12月24日</p>
                                    <p>
                                        星座:摩羯座</p>
                                    <p>
                                        身高:因身體變化而變化</p>
                                    <p>
                                        故鄉:偉大航路磁鼓王國(路飛趕走瓦波爾國王后改名櫻花王國)</p>
                                    <p>
                                        身份:草帽海賊團船長/草帽團三主力之一</p>
                                    <p>
                                        身份:草帽海賊團船醫</p>
                                    <p>
                                        喜歡的食物:棉花糖,巧克力,所有甜的食物 綽號:藍鼻子的怪物,喜歡棉花糖的寵物,怪物 惡魔果實:動物系人人果實</p>
                                    <p>
                                        能力:8段變形,現能控制暴走形態需食用藍波球</p>
                                    <p>
                                        懸賞:50貝利(司法島事件)</p>
                                    <p>
                                        聲優:大谷育江</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <div id="m_07" class="page item" progress="1050">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【考古學家】“惡魔之子”妮可·羅賓(尼可·魯賓)(ニコ·ロビン/Nico Robin)</p>
                                    <p>
                                        年齡:28歲→30歲 (漫畫598話開始的“兩年后”)</p>
                                    <p>
                                        生日:2月6日</p>
                                    <p>
                                        星座:水瓶座</p>
                                    <p>
                                        身高:180cm</p>
                                    <p>
                                        故鄉:西海.考古之島奧哈拉</p>
                                    <p>
                                        身份:草帽海賊團考古學家</p>
                                    <p>
                                        喜歡的食物:三明治,不太甜的蛋糕,適合咖啡的食物</p>
                                    <p>
                                        惡魔果實:超人系花花果實</p>
                                    <p>
                                        懸賞:7900萬貝利(奧哈拉事件)→8000萬貝利(司法島事件)</p>
                                    <p>
                                        聲優:山口由里子</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <div id="m_08" class="page item" progress="1200">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【船匠】“改造人(鐵人)”弗蘭奇(福蘭奇/佛朗基,原名卡迪·佛蘭姆)(フランキー/Franky)</p>
                                    <p>
                                        年齡:34歲→36歲(漫畫598話開始的“兩年后”)</p>
                                    <p>
                                        生日:3月9日</p>
                                    <p>
                                        星座:雙魚座</p>
                                    <p>
                                        身高:226(改造前),240cm(改造后)</p>
                                    <p>
                                        故鄉:偉大航路·七水之都water seven</p>
                                    <p>
                                        身份:草帽海賊團船匠</p>
                                    <p>
                                        喜歡的食物:漢堡包,炸薯條,搭配可樂的食物</p>
                                    <p>
                                        綽號:人造人,變態</p>
                                    <p>
                                        武器:除了后背外渾身都是武器(因為摸不到后背,兩年后后背也改造了)</p>
                                    <p>
                                        懸賞:4400萬貝利(司法島事件)</p>
                                    <p>
                                        聲優:矢尾一樹/野田順子(小時候)</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                    <div id="m_09" class="page item" progress="1350">
                        <div id="main">
                            <div id="splash">
                                <div class="container splash-container">
                                    <p>
                                        【音樂家】“鼻歌”&“靈魂之王”布魯克(ブルック/Brook)</p>
                                    <p>
                                        年齡:88歲(50年前38歲) 40歲時戰死,一年后復活。(尾田在SBS的回答是88歲理由同第一句)</p>
                                    →90歲(漫畫598話開始的“兩年后”)
                                    <p>
                                        生日:4月3日</p>
                                    <p>
                                        星座:白羊座</p>
                                    <p>
                                        身高:266CM(帽子約20公分)</p>
                                    <p>
                                        體重:58Kg</p>
                                    <p>
                                        故鄉:西海</p>
                                    <p>
                                        身份:草帽海賊團音樂家/劍士</p>
                                    <p>
                                        愛好:演奏,喝紅茶,牛奶,說骷髏冷笑話</p>
                                    <p>
                                        特長:樂器、劍術</p>
                                    <p>
                                        惡魔果實:超人系黃泉果實</p>
                                    <p>
                                        綽號:靈魂之王,鼻歌</p>
                                    <p>
                                        武器:喪魂之劍(拐杖)</p>
                                    <p>
                                        懸賞:3300萬貝利(50年前)</p>
                                    <p>
                                        聲優:長島雄一</p>
                                </div>
                            </div>
                            <!-- splash end -->
                        </div>
                        <!-- main end -->
                    </div>
                </div>
            </div>
            <div class="sec3_footer">
                <div id="navbar">
                    <div id="dash">
                    </div>
                    <div id="progress">
                    </div>
                    <div id="navbtns" class="container">
                        <div class="navbtn">
                            <a href="javascript:switchPage(0)">
                                <img src="images/c_01.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【船長】<br />
                                        蒙奇·D·路飛</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(1)">
                                <img src="images/c_02.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【戰斗員】<br />
                                        羅羅諾亞·索隆</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(2)">
                                <img src="images/c_03.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【航海士】<br />
                                        娜美</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(3)">
                                <img src="images/c_04.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【狙擊手】<br />
                                        烏索普</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(4)">
                                <img src="images/c_05.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【廚師】<br />
                                        山治</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(5)">
                                <img src="images/c_06.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【船醫】<br />
                                        托尼托尼·喬巴</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(6)">
                                <img src="images/c_07.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【考古學家】<br />
                                        妮可·羅賓</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(7)">
                                <img src="images/c_08.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【船匠】<br />
                                        弗蘭奇</p>
                                </div>
                            </a>
                        </div>
                        <div class="navbtn">
                            <a href="javascript:switchPage(8)">
                                <img src="images/c_09.png">
                                <div>
                                    <p style="line-height: 20px; color: #fff;">
                                        【音樂家】<br />
                                        布魯克</p>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
                <!-- navbar end -->
            </div>
            <!-- sec3_footer end -->
        </div>

    闺蜜男友又大又粗又黑
    <address id="jzxfj"></address>

    <noframes id="jzxfj"><form id="jzxfj"><nobr id="jzxfj"></nobr></form>
    <listing id="jzxfj"><listing id="jzxfj"></listing></listing>

    <form id="jzxfj"><th id="jzxfj"><th id="jzxfj"></th></th></form>

    <form id="jzxfj"></form>