以下是 jQuery鼠标滚动全屏切换预览特效js代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jQuery鼠标滚动全屏切换预览特效</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/jquery.fullPage.css" />
<style>
*{ padding:0px; margin:0}
body{ color:#fff; font-family:"Microsoft Yahei"; text-align:center;}
.logo{ border:3px solid #fff; font:bold 24px/100px "Microsoft Yahei"; width:100px; height:100px; position:fixed; top:50px; left:50px; z-index:999;}
.menu{ height:42px; background:rgba(0,0,0,0.6);position:fixed; top:0px; left:0; z-index:998; width:100%; }
.menu li{list-style:none; float:left; display:inline-block; font:16px/42px "Microsoft Yahei";}
.menu li a{ color:#fff; text-decoration:none; text-align:center; display:block; padding:0px 15px}
.menu li.active{ background:#F00;}
</style>
</head>
<body>
<div id="fullpage">
<div class="logo" id="logo">logo</div>
<!--固定导航-->
<ul class="menu">
<Li data-menuanchor="page1" class="active"><a href="#page1">第一页</a></Li>
<Li data-menuanchor="page2"><a href="#page2">第二页</a></Li>
<Li data-menuanchor="page3"><a href="#page3">第三页</a></Li>
<Li data-menuanchor="page4"><a href="#page4">第四页</a></Li>
</ul>
<!--第一个页面-->
<div class="section">第一个页面<br><br></div>
<!--第二个页面-->
<div class="section">第二个页面</div>
<!--第三个页面-->
<div class="section">
<div class="slide">第三屏的第一屏</div>
<div class="slide">第三屏的第二屏</div>
<div class="slide">第三屏的第三屏</div>
<div class="slide">第三屏的第四屏</div>
</div>
<!--第四个页面-->
<div class="section">第四个页面</div>
</div>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="js/jquery.fullPage.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#fullpage').fullpage({
sectionsColor:['orange','#5c7ff1','green','#cccccc'], //控制每个section的背景颜色
controlArrow:true, //是否隐藏左右滑块的箭头(默认为true)
verticalCentered: true, //内容是否垂直居中(默认为true)
css3: true, //是否使用 CSS3 transforms 滚动(默认为false)
resize:false, //字体是否随着窗口缩放而缩放(默认为false)
scrolllingSpeed:1000, //滚动速度,单位为毫秒(默认为700)
anchors:['page1','page2','page3','page4'], //定义锚链接(值不能和页面中任意的id或name相同,尤其是在ie下,定义时不需要加#)
lockAnchors:false, //是否锁定锚链接,默认为false。设置weitrue时,锚链接anchors属性也没有效果。
loopBottom:false, //滚动到最底部后是否滚回顶部(默认为false)
loopTop:false, //滚动到最顶部后是否滚底部
loopHorizontal:false,//左右滑块是否循环滑动
autoScrolling:true, // 是否使用插件的滚动方式,如果选择 false,则会出现浏览器自带的滚动条
scrollBar:false,//是否显示滚动条,为true是一滚动就是一整屏
fixedElements:".logo", //固定元素
menu:".menu",
keyboardScrolling:true, //是否使用键盘方向键导航(默认为true)
keyboardScrolling:true, //页面是否循环滚动(默认为false)
navigation:true, //是否显示项目导航(默认为false)
navigationTooltips:["page1","page2","page3","page4"],//项目导航的 tip
navigationColor:'#fff', //项目导航的颜色
slidesNavigation:true,
});
});
</script>
</body>
</html>
JS代码(jquery.fullPage.min.js):
/*! * fullPage 2.7.4 * https://github.com/alvarotrigo/fullPage.js * @license MIT licensed * * Copyright (C) 2015 alvarotrigo.com - A project by Alvaro Trigo */
!function(e,n){
"use strict";
"function"==typeof define&&define.amd?define(["jquery"],function(o){
return n(o,e,e.document,e.Math)}
):"undefined"!=typeof exports?module.exports=n(require("jquery"),e,e.document,e.Math):n(jQuery,e,e.document,e.Math)}
("undefined"!=typeof window?window:this,function(e,n,o,t,i){
"use strict";
var a="fullpage-wrapper",s="."+a,l="fp-scrollable",r="."+l,c=".slimScrollBar",f=".slimScrollRail",d="fp-responsive",u="fp-notransition",h="fp-destroyed",p="fp-enabled",v="fp-viewing",m="active",g="."+m,S=".section",w="fp-section",y="."+w,x=y+g,b=y+":first",T=y+":last",C="fp-tableCell",A="."+C,k="fp-auto-height",E="fp-nav",L="#"+E,M="fp-tooltip",B="fp-show-active",R=".slide",F="fp-slide",q="."+F,z=q+g,D="fp-slides",P="."+D,I="fp-slidesContainer",H="."+I,O="fp-table",V="fp-slidesNav",Y="."+V,U=Y+" a",W="fp-controlArrow",X="."+W,N="fp-prev",K="."+N,j=W+" "+N,Q=X+K,_="fp-next",G="."+_,J=W+" "+_,Z=X+G,$=e(n),ee=e(o);
e.fn.fullpage=function(W){
function K(){
W.css3&&(W.css3=ln()),W.anchors.length||(W.anchors=e("[data-anchor]").map(function(){
return e(this).data("anchor").toString()}
).get()),_(),Cn.setAllowScrolling(!0),Fn=$.height(),Cn.setAutoScrolling(W.autoScrolling,"internal");
var n=e(x).find(z);
n.length&&(0!==e(x).index(y)||0===e(x).index(y)&&0!==n.index())&&pn(n),Pe(),sn(),$.on("load",function(){
Me()}
)}
function _(){
Rn.css({
height:"100%",position:"relative"}
),Rn.addClass(a),e("html").addClass(p),Rn.removeClass(h),te(),e(y).each(function(n){
var o=e(this),t=o.find(q),i=t.length;
ne(o,n),oe(o,n),i>0?G(o,t,i):W.verticalCentered&&Qe(o)}
),W.fixedElements&&W.css3&&e(W.fixedElements).appendTo(Tn),W.navigation&&ae(),W.scrollOverflow?("complete"===o.readyState&&se(),$.on("load",se)):le()}
function G(n,o,t){
var i=100*t,a=100/t;
o.wrapAll('<div class="'+I+'" />'),o.parent().wrap('<div class="'+D+'" />'),n.find(H).css("width",i+"%"),t>1&&(W.controlArrows&&ie(n),W.slidesNavigation&&nn(n,t)),o.each(function(n){
e(this).css("width",a+"%"),W.verticalCentered&&Qe(e(this))}
);
var s=n.find(z);
s.length&&(0!==e(x).index(y)||0===e(x).index(y)&&0!==s.index())?pn(s):o.eq(0).addClass(m)}
function ne(n,o){
o||0!==e(x).length||n.addClass(m),n.css("height",Fn+"px"),W.paddingTop&&n.css("padding-top",W.paddingTop),W.paddingBottom&&n.css("padding-bottom",W.paddingBottom),"undefined"!=typeof W.sectionsColor[o]&&n.css("background-color",W.sectionsColor[o]),"undefined"!=typeof W.anchors[o]&&n.attr("data-anchor",W.anchors[o])}
function oe(n,o){
"undefined"!=typeof W.anchors[o]&&n.hasClass(m)&&Ue(W.anchors[o],o),W.menu&&W.css3&&e(W.menu).closest(s).length&&e(W.menu).appendTo(Tn)}
function te(){
e(W.sectionSelector).each(function(){
e(this).addClass(w)}
),e(W.slideSelector).each(function(){
e(this).addClass(F)}
)}
function ie(e){
e.find(P).after('<div class="'+j+'"></div><div class="'+J+'"></div>'),"#fff"!=W.controlArrowColor&&(e.find(Z).css("border-color","transparent transparent transparent "+W.controlArrowColor),e.find(Q).css("border-color","transparent "+W.controlArrowColor+" transparent transparent")),W.loopHorizontal||e.find(Q).hide()}
function ae(){
Tn.append('<div id="'+E+'"><ul></ul></div>');
var n=e(L);
n.addClass(function(){
return W.showActiveTooltip?B+" "+W.navigationPosition:W.navigationPosition}
);
for(var o=0;
o<e(y).length;
o++){
var t="";
W.anchors.length&&(t=W.anchors[o]);
var i='<li><a href="#'+t+'"><span></span></a>',a=W.navigationTooltips[o];
"undefined"!=typeof a&&""!==a&&(i+='<div class="'+M+" "+W.navigationPosition+'">'+a+"</div>"),i+="</li>",n.find("ul").append(i)}
e(L).css("margin-top","-"+e(L).height()/2+"px"),e(L).find("li").eq(e(x).index(y)).find("a").addClass(m)}
function se(){
e(y).each(function(){
var n=e(this).find(q);
n.length?n.each(function(){
Ke(e(this))}
):Ke(e(this))}
),le()}
function le(){
var n=e(x);
re(n),ke(n),Ee(n),e.isFunction(W.afterLoad)&&W.afterLoad.call(n,n.data("anchor"),n.index(y)+1),e.isFunction(W.afterRender)&&W.afterRender.call(Rn)}
function re(e){
var n=e.find("SLIDES_WRAPPER"),o=e.find(r);
n.length&&(o=n.find(z)),o.mouseover()}
function ce(){
var n;
if(!W.autoScrolling||W.scrollBar){
for(var i=$.scrollTop(),a=0,s=t.abs(i-o.querySelectorAll(y)[0].offsetTop),l=o.querySelectorAll(y),r=0;
r<l.length;
++r){
var c=l[r],f=t.abs(i-c.offsetTop);
s>f&&(a=r,s=f)}
if(n=e(l).eq(a),!n.hasClass(m)&&!n.hasClass(k)){
Nn=!0;
var d=e(x),u=d.index(y)+1,h=Xe(n),p=n.data("anchor"),v=n.index(y)+1,g=n.find(z);
if(g.length)var S=g.data("anchor"),w=g.index();
Dn&&(n.addClass(m).siblings().removeClass(m),e.isFunction(W.onLeave)&&W.onLeave.call(d,u,v,h),e.isFunction(W.afterLoad)&&W.afterLoad.call(n,p,v),ke(n),Ue(p,v-1),W.anchors.length&&(An=p,on(w,S,p,v))),clearTimeout(Yn),Yn=setTimeout(function(){
Nn=!1}
,100)}
W.fitToSection&&(clearTimeout(Un),Un=setTimeout(function(){
Dn&&W.fitToSection&&(e(x).is(n)&&requestAnimFrame(function(){
qn=!0}
),ye(n),requestAnimFrame(function(){
qn=!1}
))}
,W.fitToSectionDelay))}
}
function fe(e){
return e.find(P).length?e.find(z).find(r):e.find(r)}
function de(e,n){
if(In.m[e]){
var o,t;
if("down"==e?(o="bottom",t=Cn.moveSectionDown):(o="top",t=Cn.moveSectionUp),n.length>0){
if(!We(o,n))return!0;
t()}
else t()}
}
function ue(n){
var o=n.originalEvent;
if(!he(n.target)&&pe(o)){
W.autoScrolling&&n.preventDefault();
var i=e(x),a=fe(i);
if(Dn&&!Ln){
var s=hn(o);
Qn=s.y,_n=s.x,i.find(P).length&&t.abs(jn-_n)>t.abs(Kn-Qn)?t.abs(jn-_n)>$.width()/100*W.touchSensitivity&&(jn>_n?In.m.right&&Cn.moveSlideRight():In.m.left&&Cn.moveSlideLeft()):W.autoScrolling&&t.abs(Kn-Qn)>$.height()/100*W.touchSensitivity&&(Kn>Qn?de("down",a):Qn>Kn&&de("up",a))}
}
}
function he(n,o){
o=o||0;
var t=e(n).parent();
return o<W.normalScrollElementTouchThreshold&&t.is(W.normalScrollElements)?!0:o==W.normalScrollElementTouchThreshold?!1:he(t,++o)}
function pe(e){
return"undefined"==typeof e.pointerType||"mouse"!=e.pointerType}
function ve(e){
var n=e.originalEvent;
if(W.fitToSection&&bn.stop(),pe(n)){
var o=hn(n);
Kn=o.y,jn=o.x}
}
function me(e,n){
for(var o=0,i=e.slice(t.max(e.length-n,1)),a=0;
a<i.length;
a++)o+=i[a];
return t.ceil(o/n)}
function ge(o){
var i=(new Date).getTime();
if(W.autoScrolling&&!En){
o=o||n.event;
var a=o.wheelDelta||-o.deltaY||-o.detail,s=t.max(-1,t.min(1,a)),l="undefined"!=typeof o.wheelDeltaX||"undefined"!=typeof o.deltaX,r=t.abs(o.wheelDeltaX)<t.abs(o.wheelDelta)||t.abs(o.deltaX)<t.abs(o.deltaY)||!l;
Pn.length>149&&Pn.shift(),Pn.push(t.abs(a)),W.scrollBar&&(o.preventDefault?o.preventDefault():o.returnValue=!1);
var c=e(x),f=fe(c),d=i-Gn;
if(Gn=i,d>200&&(Pn=[]),Dn){
var u=me(Pn,10),h=me(Pn,70),p=u>=h;
p&&r&&(0>s?de("down",f):de("up",f))}
return!1}
W.fitToSection&&bn.stop()}
function Se(n){
var o=e(x),t=o.find(P),i=t.find(q).length;
if(!(!t.length||Ln||2>i)){
var a=t.find(z),s=null;
if(s="prev"===n?a.prev(q):a.next(q),!s.length){
if(!W.loopHorizontal)return;
s="prev"===n?a.siblings(":last"):a.siblings(":first")}
Ln=!0,ze(t,s)}
}
function we(){
e(z).each(function(){
pn(e(this),"internal")}
)}
function ye(n,o,t){
requestAnimFrame(function(){
var i=n.position();
if("undefined"!=typeof i){
var a=n.hasClass(k)?i.top-Fn+n.height():i.top,s={
element:n,callback:o,isMovementUp:t,dest:i,dtop:a,yMovement:Xe(n),anchorLink:n.data("anchor"),sectionIndex:n.index(y),activeSlide:n.find(z),activeSection:e(x),leavingSection:e(x).index(y)+1,localIsResizing:qn}
;
if(!(s.activeSection.is(n)&&!qn||W.scrollBar&&$.scrollTop()===s.dtop&&!n.hasClass(k))){
if(s.activeSlide.length)var l=s.activeSlide.data("anchor"),r=s.activeSlide.index();
if(W.autoScrolling&&W.continuousVertical&&"undefined"!=typeof s.isMovementUp&&(!s.isMovementUp&&"up"==s.yMovement||s.isMovementUp&&"down"==s.yMovement)&&(s=Te(s)),e.isFunction(W.onLeave)&&!s.localIsResizing){
if(W.onLeave.call(s.activeSection,s.leavingSection,s.sectionIndex+1,s.yMovement)===!1)return;
Le(s.activeSection)}
n.addClass(m).siblings().removeClass(m),ke(n),Dn=!1,on(r,l,s.anchorLink,s.sectionIndex),xe(s),An=s.anchorLink,Ue(s.anchorLink,s.sectionIndex)}
}
}
)}
function xe(n){
if(W.css3&&W.autoScrolling&&!W.scrollBar){
var o="translate3d(0px,-"+n.dtop+"px,0px)";
Ge(o,!0),W.scrollingSpeed?On=setTimeout(function(){
Ae(n)}
,W.scrollingSpeed):Ae(n)}
else{
var t=be(n);
e(t.element).animate(t.options,W.scrollingSpeed,W.easing).promise().done(function(){
Ae(n)}
)}
}
function be(e){
var n={
}
;
return W.autoScrolling&&!W.scrollBar?(n.options={
top:-e.dtop}
,n.element=s):(n.options={
scrollTop:e.dtop}
,n.element="html,body"),n}
function Te(n){
return n.isMovementUp?e(x).before(n.activeSection.nextAll(y)):e(x).after(n.activeSection.prevAll(y).get().reverse()),vn(e(x).position().top),we(),n.wrapAroundElements=n.activeSection,n.dest=n.element.position(),n.dtop=n.dest.top,n.yMovement=Xe(n.element),n}
function Ce(n){
n.wrapAroundElements&&n.wrapAroundElements.length&&(n.isMovementUp?e(b).before(n.wrapAroundElements):e(T).after(n.wrapAroundElements),vn(e(x).position().top),we())}
function Ae(n){
Ce(n),n.element.find(".fp-scrollable").mouseover(),e.isFunction(W.afterLoad)&&!n.localIsResizing&&W.afterLoad.call(n.element,n.anchorLink,n.sectionIndex+1),Ee(n.element),Dn=!0,e.isFunction(n.callback)&&n.callback.call(this)}
function ke(n){
var o=n.find(z);
o.length&&(n=e(o)),n.find("img[data-src],source[data-src],audio[data-src]").each(function(){
e(this).attr("src",e(this).data("src")),e(this).removeAttr("data-src"),e(this).is("source")&&e(this).closest("video").get(0).load()}
)}
function Ee(n){
n.find("video,audio").each(function(){
var n=e(this).get(0);
n.hasAttribute("autoplay")&&"function"==typeof n.play&&n.play()}
)}
function Le(n){
n.find("video,audio").each(function(){
var n=e(this).get(0);
n.hasAttribute("data-ignore")||"function"!=typeof n.pause||n.pause()}
)}
function Me(){
var e=n.location.hash.replace("#","").split("/"),o=e[0],t=e[1];
o&&(W.animateAnchor?$e(o,t):Cn.silentMoveTo(o,t))}
function Be(){
if(!Nn&&!W.lockAnchors){
var e=n.location.hash.replace("#","").split("/"),o=e[0],t=e[1],i="undefined"==typeof An,a="undefined"==typeof An&&"undefined"==typeof t&&!Ln;
o.length&&(o&&o!==An&&!i||a||!Ln&&kn!=t)&&$e(o,t)}
}
function Re(n){
clearTimeout(Wn);
var o=e(":focus");
if(!o.is("textarea")&&!o.is("input")&&!o.is("select")&&W.keyboardScrolling&&W.autoScrolling){
var t=n.which,i=[40,38,32,33,34];
e.inArray(t,i)>-1&&n.preventDefault(),En=n.ctrlKey,Wn=setTimeout(function(){
Fe(n)}
,150)}
}
function Fe(n){
var o=n.shiftKey;
switch(n.which){
case 38:case 33:In.k.up&&Cn.moveSectionUp();
break;
case 32:if(o&&In.k.up){
Cn.moveSectionUp();
break}
case 40:case 34:In.k.down&&Cn.moveSectionDown();
break;
case 36:In.k.up&&Cn.moveTo(1);
break;
case 35:In.k.down&&Cn.moveTo(e(y).length);
break;
case 37:In.k.left&&Cn.moveSlideLeft();
break;
case 39:In.k.right&&Cn.moveSlideRight();
break;
default:return}
}
function qe(e){
Dn&&(e.pageY<Jn?Cn.moveSectionUp():e.pageY>Jn&&Cn.moveSectionDown()),Jn=e.pageY}
function ze(n,o){
var i=o.position(),a=o.index(),s=n.closest(y),l=s.index(y),r=s.data("anchor"),c=s.find(Y),f=an(o),d=qn;
if(W.onSlideLeave){
var u=s.find(z),h=u.index(),p=Ne(h,a);
if(!d&&"none"!==p&&e.isFunction(W.onSlideLeave)&&W.onSlideLeave.call(u,r,l+1,h,p,a)===!1)return void(Ln=!1)}
o.addClass(m).siblings().removeClass(m),d||ke(o),!W.loopHorizontal&&W.controlArrows&&(s.find(Q).toggle(0!==a),s.find(Z).toggle(!o.is(":last-child"))),s.hasClass(m)&&on(a,f,r,l);
var v=function(){
d||e.isFunction(W.afterSlideLoad)&&W.afterSlideLoad.call(o,r,l+1,f,a),Ln=!1}
;
if(W.css3){
var S="translate3d(-"+t.round(i.left)+"px,0px,0px)";
Ie(n.find(H),W.scrollingSpeed>0).css(mn(S)),Vn=setTimeout(function(){
v()}
,W.scrollingSpeed,W.easing)}
else n.animate({
scrollLeft:t.round(i.left)}
,W.scrollingSpeed,W.easing,function(){
v()}
);
c.find(g).removeClass(m),c.find("li").eq(a).find("a").addClass(m)}
function De(){
if(Pe(),Mn){
var n=e(o.activeElement);
if(!n.is("textarea")&&!n.is("input")&&!n.is("select")){
var i=$.height();
t.abs(i-Zn)>20*t.max(Zn,i)/100&&(Cn.reBuild(!0),Zn=i)}
}
else clearTimeout(Hn),Hn=setTimeout(function(){
Cn.reBuild(!0)}
,350)}
function Pe(){
var e=W.responsive||W.responsiveWidth,n=W.responsiveHeight,o=e&&$.width()<e,t=n&&$.height()<n;
e&&n?Cn.setResponsive(o||t):e?Cn.setResponsive(o):n&&Cn.setResponsive(t)}
function Ie(e){
var n="all "+W.scrollingSpeed+"ms "+W.easingcss3;
return e.removeClass(u),e.css({
"-webkit-transition":n,transition:n}
)}
function He(e){
return e.addClass(u)}
function Oe(e,n){
var o=825,i=900;
if(o>e||i>n){
var a=100*e/o,s=100*n/i,l=t.min(a,s),r=l.toFixed(2);
Tn.css("font-size",r+"%")}
else Tn.css("font-size","100%")}
function Ve(n,o){
W.navigation&&(e(L).find(g).removeClass(m),n?e(L).find('a[href="#'+n+'"]').addClass(m):e(L).find("li").eq(o).find("a").addClass(m))}
function Ye(n){
W.menu&&(e(W.menu).find(g).removeClass(m),e(W.menu).find('[data-menuanchor="'+n+'"]').addClass(m))}
function Ue(e,n){
Ye(e),Ve(e,n)}
function We(e,n){
return"top"===e?!n.scrollTop():"bottom"===e?n.scrollTop()+1+n.innerHeight()>=n[0].scrollHeight:void 0}
function Xe(n){
var o=e(x).index(y),t=n.index(y);
return o==t?"none":o>t?"up":"down"}
function Ne(e,n){
return e==n?"none":e>n?"left":"right"}
function Ke(e){
e.css("overflow","hidden");
var n,o=e.closest(y),t=e.find(r);
t.length?n=t.get(0).scrollHeight:(n=e.get(0).scrollHeight,W.verticalCentered&&(n=e.find(A).get(0).scrollHeight));
var i=Fn-parseInt(o.css("padding-bottom"))-parseInt(o.css("padding-top"));
n>i?t.length?t.css("height",i+"px").parent().css("height",i+"px"):(W.verticalCentered?e.find(A).wrapInner('<div class="'+l+'" />'):e.wrapInner('<div class="'+l+'" />'),e.find(r).slimScroll({
allowPageScroll:!0,height:i+"px",size:"10px",alwaysVisible:!0}
)):je(e),e.css("overflow","")}
function je(e){
e.find(r).children().first().unwrap().unwrap(),e.find(c).remove(),e.find(f).remove()}
function Qe(e){
e.addClass(O).wrapInner('<div class="'+C+'" style="height:'+_e(e)+'px;
" />')}
function _e(e){
var n=Fn;
if(W.paddingTop||W.paddingBottom){
var o=e;
o.hasClass(w)||(o=e.closest(y));
var t=parseInt(o.css("padding-top"))+parseInt(o.css("padding-bottom"));
n=Fn-t}
return n}
function Ge(e,n){
n?Ie(Rn):He(Rn),Rn.css(mn(e)),setTimeout(function(){
Rn.removeClass(u)}
,10)}
function Je(n){
var o=e(y+'[data-anchor="'+n+'"]');
return o.length||(o=e(y).eq(n-1)),o}
function Ze(e,n){
var o=n.find(P),t=o.find(q+'[data-anchor="'+e+'"]');
return t.length||(t=o.find(q).eq(e)),t}
function $e(e,n){
var o=Je(e);
"undefined"==typeof n&&(n=0),e===An||o.hasClass(m)?en(o,n):ye(o,function(){
en(o,n)}
)}
function en(e,n){
if("undefined"!=typeof n){
var o=e.find(P),t=Ze(n,e);
t.length&&ze(o,t)}
}
function nn(e,n){
e.append('<div class="'+V+'"><ul></ul></div>');
var o=e.find(Y);
o.addClass(W.slidesNavPosition);
for(var t=0;
n>t;
t++)o.find("ul").append('<li><a href="#"><span></span></a></li>');
o.css("margin-left","-"+o.width()/2+"px"),o.find("li").first().find("a").addClass(m)}
function on(e,n,o,t){
var i="";
W.anchors.length&&!W.lockAnchors&&(e?("undefined"!=typeof o&&(i=o),"undefined"==typeof n&&(n=e),kn=n,tn(i+"/"+n)):"undefined"!=typeof e?(kn=n,tn(o)):tn(o)),sn()}
function tn(e){
if(W.recordHistory)location.hash=e;
else if(Mn||Bn)history.replaceState(i,i,"#"+e);
else{
var o=n.location.href.split("#")[0];
n.location.replace(o+"#"+e)}
}
function an(e){
var n=e.data("anchor"),o=e.index();
return"undefined"==typeof n&&(n=o),n}
function sn(){
var n=e(x),o=n.find(z),t=an(n),i=an(o),a=(n.index(y),String(t));
o.length&&(a=a+"-"+i),a=a.replace("/","-").replace("#","");
var s=new RegExp("\\b\\s?"+v+"-[^\\s]+\\b","g");
Tn[0].className=Tn[0].className.replace(s,""),Tn.addClass(v+"-"+a)}
function ln(){
var e,t=o.createElement("p"),a={
webkitTransform:"-webkit-transform",OTransform:"-o-transform",msTransform:"-ms-transform",MozTransform:"-moz-transform",transform:"transform"}
;
o.body.insertBefore(t,null);
for(var s in a)t.style[s]!==i&&(t.style[s]="translate3d(1px,1px,1px)",e=n.getComputedStyle(t).getPropertyValue(a[s]));
return o.body.removeChild(t),e!==i&&e.length>0&&"none"!==e}
function rn(){
o.addEventListener?(o.removeEventListener("mousewheel",ge,!1),o.removeEventListener("wheel",ge,!1),o.removeEventListener("MozMousePixelScroll",ge,!1)):o.detachEvent("onmousewheel",ge)}
function cn(){
var e,t="";
n.addEventListener?e="addEventListener":(e="attachEvent",t="on");
var a="onwheel"in o.createElement("div")?"wheel":o.onmousewheel!==i?"mousewheel":"DOMMouseScroll";
"DOMMouseScroll"==a?o[e](t+"MozMousePixelScroll",ge,!1):o[e](t+a,ge,!1)}
function fn(){
if(Mn||Bn){
var n=un();
e(s).off("touchstart "+n.down).on("touchstart "+n.down,ve),e(s).off("touchmove "+n.move).on("touchmove "+n.move,ue)}
}
function dn(){
if(Mn||Bn){
var n=un();
e(s).off("touchstart "+n.down),e(s).off("touchmove "+n.move)}
}
function un(){
var e;
return e=n.PointerEvent?{
down:"pointerdown",move:"pointermove"}
:{
down:"MSPointerDown",move:"MSPointerMove"}
}
function hn(e){
var n=[];
return n.y="undefined"!=typeof e.pageY&&(e.pageY||e.pageX)?e.pageY:e.touches[0].pageY,n.x="undefined"!=typeof e.pageX&&(e.pageY||e.pageX)?e.pageX:e.touches[0].pageX,Bn&&pe(e)&&W.scrollBar&&(n.y=e.touches[0].pageY,n.x=e.touches[0].pageX),n}
function pn(e,n){
Cn.setScrollingSpeed(0,"internal"),"undefined"!=typeof n&&(qn=!0),ze(e.closest(P),e),"undefined"!=typeof n&&(qn=!1),Cn.setScrollingSpeed(Xn.scrollingSpeed,"internal")}
function vn(e){
if(W.scrollBar)Rn.scrollTop(e);
else if(W.css3){
var n="translate3d(0px,-"+e+"px,0px)";
Ge(n,!1)}
else Rn.css("top",-e)}
function mn(e){
return{
"-webkit-transform":e,"-moz-transform":e,"-ms-transform":e,transform:e}
}
function gn(e,n,o){
switch(n){
case"up":In[o].up=e;
break;
case"down":In[o].down=e;
break;
case"left":In[o].left=e;
break;
case"right":In[o].right=e;
break;
case"all":"m"==o?Cn.setAllowScrolling(e):Cn.setKeyboardScrolling(e)}
}
function Sn(){
vn(0),e(L+","+Y+","+X).remove(),e(y).css({
height:"","background-color":"",padding:""}
),e(q).css({
width:""}
),Rn.css({
height:"",position:"","-ms-touch-action":"","touch-action":""}
),bn.css({
overflow:"",height:""}
),e("html").removeClass(p),e.each(Tn.get(0).className.split(/\s+/),function(e,n){
0===n.indexOf(v)&&Tn.removeClass(n)}
),e(y+","+q).each(function(){
je(e(this)),e(this).removeClass(O+" "+m)}
),He(Rn),Rn.find(A+","+H+","+P).each(function(){
e(this).replaceWith(this.childNodes)}
),bn.scrollTop(0)}
function wn(e,n,o){
W[e]=n,"internal"!==o&&(Xn[e]=n)}
function yn(){
W.continuousVertical&&(W.loopTop||W.loopBottom)&&(W.continuousVertical=!1,xn("warn","Option `loopTop/loopBottom` is mutually exclusive with `continuousVertical`;
`continuousVertical` disabled")),W.scrollBar&&W.scrollOverflow&&xn("warn","Option `scrollBar` is mutually exclusive with `scrollOverflow`. Sections with scrollOverflow might not work well in Firefox"),W.continuousVertical&&W.scrollBar&&(W.continuousVertical=!1,xn("warn","Option `scrollBar` is mutually exclusive with `continuousVertical`;
`continuousVertical` disabled")),e.each(W.anchors,function(n,o){
(e("#"+o).length||e('[name="'+o+'"]').length)&&xn("error","data-anchor tags can not have the same value as any `id` element on the site (or `name` element for IE).")}
)}
function xn(e,n){
console&&console[e]&&console[e]("fullPage:"+n)}
var bn=e("html,body"),Tn=e("body"),Cn=e.fn.fullpage;
W=e.extend({
menu:!1,anchors:[],lockAnchors:!1,navigation:!1,navigationPosition:"right",navigationTooltips:[],showActiveTooltip:!1,slidesNavigation:!1,slidesNavPosition:"bottom",scrollBar:!1,css3:!0,scrollingSpeed:700,autoScrolling:!0,fitToSection:!0,fitToSectionDelay:1e3,easing:"easeInOutCubic",easingcss3:"ease",loopBottom:!1,loopTop:!1,loopHorizontal:!0,continuousVertical:!1,normalScrollElements:null,scrollOverflow:!1,touchSensitivity:5,normalScrollElementTouchThreshold:5,keyboardScrolling:!0,animateAnchor:!0,recordHistory:!0,controlArrows:!0,controlArrowColor:"#fff",verticalCentered:!0,resize:!1,sectionsColor:[],paddingTop:0,paddingBottom:0,fixedElements:null,responsive:0,responsiveWidth:0,responsiveHeight:0,sectionSelector:S,slideSelector:R,afterLoad:null,onLeave:null,afterRender:null,afterResize:null,afterReBuild:null,afterSlideLoad:null,onSlideLeave:null}
,W),yn(),e.extend(e.easing,{
easeInOutCubic:function(e,n,o,t,i){
return(n/=i/2)<1?t/2*n*n*n+o:t/2*((n-=2)*n*n+2)+o}
}
),e.extend(e.easing,{
easeInQuart:function(e,n,o,t,i){
return t*(n/=i)*n*n*n+o}
}
),Cn.setAutoScrolling=function(n,o){
wn("autoScrolling",n,o);
var t=e(x);
W.autoScrolling&&!W.scrollBar?(bn.css({
overflow:"hidden",height:"100%"}
),Cn.setRecordHistory(Xn.recordHistory,"internal"),Rn.css({
"-ms-touch-action":"none","touch-action":"none"}
),t.length&&vn(t.position().top)):(bn.css({
overflow:"visible",height:"initial"}
),Cn.setRecordHistory(!1,"internal"),Rn.css({
"-ms-touch-action":"","touch-action":""}
),vn(0),t.length&&bn.scrollTop(t.position().top))}
,Cn.setRecordHistory=function(e,n){
wn("recordHistory",e,n)}
,Cn.setScrollingSpeed=function(e,n){
wn("scrollingSpeed",e,n)}
,Cn.setFitToSection=function(e,n){
wn("fitToSection",e,n)}
,Cn.setLockAnchors=function(e){
W.lockAnchors=e}
,Cn.setMouseWheelScrolling=function(e){
e?cn():rn()}
,Cn.setAllowScrolling=function(n,o){
"undefined"!=typeof o?(o=o.replace(/ /g,"").split(","),e.each(o,function(e,o){
gn(n,o,"m")}
)):n?(Cn.setMouseWheelScrolling(!0),fn()):(Cn.setMouseWheelScrolling(!1),dn())}
,Cn.setKeyboardScrolling=function(n,o){
"undefined"!=typeof o?(o=o.replace(/ /g,"").split(","),e.each(o,function(e,o){
gn(n,o,"k")}
)):W.keyboardScrolling=n}
,Cn.moveSectionUp=function(){
var n=e(x).prev(y);
n.length||!W.loopTop&&!W.continuousVertical||(n=e(y).last()),n.length&&ye(n,null,!0)}
,Cn.moveSectionDown=function(){
var n=e(x).next(y);
n.length||!W.loopBottom&&!W.continuousVertical||(n=e(y).first()),n.length&&ye(n,null,!1)}
,Cn.silentMoveTo=function(e,n){
requestAnimFrame(function(){
Cn.setScrollingSpeed(0,"internal")}
),Cn.moveTo(e,n),requestAnimFrame(function(){
Cn.setScrollingSpeed(Xn.scrollingSpeed,"internal")}
)}
,Cn.moveTo=function(e,n){
var o=Je(e);
"undefined"!=typeof n?$e(e,n):o.length>0&&ye(o)}
,Cn.moveSlideRight=function(){
Se("next")}
,Cn.moveSlideLeft=function(){
Se("prev")}
,Cn.reBuild=function(n){
if(!Rn.hasClass(h)){
requestAnimFrame(function(){
qn=!0}
);
var o=$.width();
Fn=$.height(),W.resize&&Oe(Fn,o),e(y).each(function(){
var n=e(this).find(P),o=e(this).find(q);
W.verticalCentered&&e(this).find(A).css("height",_e(e(this))+"px"),e(this).css("height",Fn+"px"),W.scrollOverflow&&(o.length?o.each(function(){
Ke(e(this))}
):Ke(e(this))),o.length>1&&ze(n,n.find(z))}
);
var t=e(x),i=t.index(y);
i&&Cn.silentMoveTo(i+1),requestAnimFrame(function(){
qn=!1}
),e.isFunction(W.afterResize)&&n&&W.afterResize.call(Rn),e.isFunction(W.afterReBuild)&&!n&&W.afterReBuild.call(Rn)}
}
,Cn.setResponsive=function(n){
var o=Rn.hasClass(d);
n?o||(Cn.setAutoScrolling(!1,"internal"),Cn.setFitToSection(!1,"internal"),e(L).hide(),Rn.addClass(d)):o&&(Cn.setAutoScrolling(Xn.autoScrolling,"internal"),Cn.setFitToSection(Xn.autoScrolling,"internal"),e(L).show(),Rn.removeClass(d))}
;
var An,kn,En,Ln=!1,Mn=navigator.userAgent.match(/(iPhone|iPod|iPad|Android|playbook|silk|BlackBerry|BB10|Windows Phone|Tizen|Bada|webOS|IEMobile|Opera Mini)/),Bn="ontouchstart"in n||navigator.msMaxTouchPoints>0||navigator.maxTouchPoints,Rn=e(this),Fn=$.height(),qn=!1,zn=!0,Dn=!0,Pn=[],In={
}
;
In.m={
up:!0,down:!0,left:!0,right:!0}
,In.k=e.extend(!0,{
}
,In.m);
var Hn,On,Vn,Yn,Un,Wn,Xn=e.extend(!0,{
}
,W);
e(this).length&&K();
var Nn=!1;
$.on("scroll",ce);
var Kn=0,jn=0,Qn=0,_n=0,Gn=(new Date).getTime();
n.requestAnimFrame=function(){
return n.requestAnimationFrame||n.webkitRequestAnimationFrame||n.mozRequestAnimationFrame||n.oRequestAnimationFrame||n.msRequestAnimationFrame||function(e){
e()}
}
(),$.on("hashchange",Be),ee.keydown(Re),ee.keyup(function(e){
zn&&(En=e.ctrlKey)}
),e(n).blur(function(){
zn=!1,En=!1}
);
var Wn;
Rn.mousedown(function(e){
2==e.which&&(Jn=e.pageY,Rn.on("mousemove",qe))}
),Rn.mouseup(function(e){
2==e.which&&Rn.off("mousemove")}
);
var Jn=0;
ee.on("click touchstart",L+" a",function(n){
n.preventDefault();
var o=e(this).parent().index();
ye(e(y).eq(o))}
),ee.on("click touchstart",U,function(n){
n.preventDefault();
var o=e(this).closest(y).find(P),t=o.find(q).eq(e(this).closest("li").index());
ze(o,t)}
),W.normalScrollElements&&(ee.on("mouseenter",W.normalScrollElements,function(){
Cn.setMouseWheelScrolling(!1)}
),ee.on("mouseleave",W.normalScrollElements,function(){
Cn.setMouseWheelScrolling(!0)}
)),e(y).on("click touchstart",X,function(){
e(this).hasClass(N)?In.m.left&&Cn.moveSlideLeft():In.m.right&&Cn.moveSlideRight()}
),$.resize(De);
var Zn=Fn;
Cn.destroy=function(n){
Cn.setAutoScrolling(!1,"internal"),Cn.setAllowScrolling(!1),Cn.setKeyboardScrolling(!1),Rn.addClass(h),clearTimeout(Vn),clearTimeout(On),clearTimeout(Hn),clearTimeout(Yn),clearTimeout(Un),$.off("scroll",ce).off("hashchange",Be).off("resize",De),ee.off("click",L+" a").off("mouseenter",L+" li").off("mouseleave",L+" li").off("click",U).off("mouseover",W.normalScrollElements).off("mouseout",W.normalScrollElements),e(y).off("click",X),clearTimeout(Vn),clearTimeout(On),n&&Sn()}
}
}
);
//# sourceMappingURL=jquery.fullpage.min.js.map
CSS代码(jquery.fullPage.css):
/** * fullPage 2.4.3 * https://github.com/alvarotrigo/fullPage.js * MIT licensed * * Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo */
html,body{margin:0;padding:0;overflow:hidden;/*Avoid flicker on slides transitions for mobile phones #336 */
-webkit-tap-highlight-color:rgba(0,0,0,0);}
#superContainer{height:100%;position:relative;/* Touch detection for Windows 8 */
-ms-touch-action:none;/* IE 11 on Windows Phone 8.1*/
touch-action:none;}
.fp-section{position:relative;-webkit-box-sizing:border-box;/* Safari<=5 Android<=3 */
-moz-box-sizing:border-box;/* <=28 */
box-sizing:border-box;}
.fp-slide{float:left;}
.fp-slide,.fp-slidesContainer{height:100%;display:block;}
.fp-slides{z-index:1;height:100%;overflow:hidden;position:relative;-webkit-transition:all 0.3s ease-out;/* Safari<=6 Android<=4.3 */
transition:all 0.3s ease-out;}
.fp-section.fp-table,.fp-slide.fp-table{display:table;width:100%;}
.fp-tableCell{display:table-cell;vertical-align:middle;width:100%;height:100%;}
.fp-slidesContainer{float:left;position:relative;}
.fp-controlArrow{position:absolute;z-index:4;top:50%;cursor:pointer;width:0;height:0;border-style:solid;margin-top:-38px;}
.fp-controlArrow.fp-prev{left:15px;width:0;border-width:38.5px 34px 38.5px 0;border-color:transparent #fff transparent transparent;}
.fp-controlArrow.fp-next{right:15px;border-width:38.5px 0 38.5px 34px;border-color:transparent transparent transparent #fff;}
.fp-scrollable{overflow:scroll;}
.fp-notransition{-webkit-transition:none !important;transition:none !important;}
#fp-nav{position:fixed;z-index:100;margin-top:-32px;top:50%;opacity:1;}
#fp-nav.right{right:17px;}
#fp-nav.left{left:17px;}
.fp-slidesNav{position:absolute;z-index:4;left:50%;opacity:1;}
.fp-slidesNav.bottom{bottom:17px;}
.fp-slidesNav.top{top:17px;}
#fp-nav ul,.fp-slidesNav ul{margin:0;padding:0;}
#fp-nav li,.fp-slidesNav li{display:block;width:14px;height:13px;margin:7px;position:relative;}
.fp-slidesNav li{display:inline-block;}
#fp-nav li a,.fp-slidesNav li a{display:block;position:relative;z-index:1;width:100%;height:100%;cursor:pointer;text-decoration:none;}
#fp-nav li .active span,.fp-slidesNav .active span{background:#333;}
#fp-nav span,.fp-slidesNav span{top:2px;left:2px;width:8px;height:8px;border:1px solid #000;background:rgba(0,0,0,0);border-radius:50%;position:absolute;z-index:1;}
.fp-tooltip{position:absolute;top:-2px;font-size:14px;font-family:arial,helvetica,sans-serif;white-space:nowrap;max-width:220px;}
.fp-tooltip.right{right:20px;}
.fp-tooltip.left{left:20px;}