fullpage 方法

moveSectionUp():

向上滚动一页

moveSectionDown():

向下滚动一页

moveTo(section,slide):

滚动到第几页 第几个幻灯片

section从1开始  slide从0开始

使用方式

$.fn.fullpage.XXX()

selientMoveTo():

滚动到第几页和moeTo一样 只不过没有动画效果

moveSlideRight():

幻灯片向右滚动

moveSlideLeft():

幻灯片向左滚动

setAllowScrolling(boolen,[directions]):

添加或删除鼠标滚轮控制 第一个参数 true false 第二个参数表示方向 up down right left 可以使用多个 用逗号隔开

比如我们在设置一个有奖问答页面时,当用户发现前面的页面有答案时,不希望用户滚动回去查看答案可以使用这样的方法

destory(type)

销毁fullpage特效

type不写 fullpage提供的样式 html还在(背景颜色等还在)

(all) 样式 页面html 全部销毁

reBuild()y

重新定义页面和尺寸,用于ajax请求改变了页面结构之后,重建效果

 

延迟加载图片或视频 <img data-src="">

<img data-src="img.png>

视频

<video data-src="vedio.webm" type="vedio/webm">

</video>

<video data-src="vedio.mp4" type="vedio/mp4">

</video>

 

 

fullpage回调函数(在滚动的过程中触发相应的操作)

afterLoad(anchorLink,index)

滚动到某个Sectio,滚动结束后会触发该回调函数,anchorLink是锚链接的名称,index是序号从1开始

我们可以根据anchorLink和index参数值的判断触发相应的操作 

$(document).ready(function(){

 $('#fullpage').fullpage({

   afterLoad: function(anchorLink,index){

   console.log("afterLoad anchorLink"+anchorLink+", index"+index);

  }

 

});

});

 

onLeave(index,nextIndex,direction)

当离开一个Section时触发该回调函数 接收三个参数

通过return false;可以取消滚动

在afterLoad之前而且只触发一次

 

afterRend()

当页面生成后会调用的回调函数,或者页面初始化时

afterResize()

当浏览器的窗口大小发生变化时调用

afterSlideLoad(anchorLink,index,slideAnchor,slideIndex)

当滚动到某个幻灯片的回调函数

afterSlideLeave(anchorLink,index,slideIndex,direction,nextSlideIndex)

当离开某个幻灯片的回调函数

                               

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  

 

转载于:https://www.cnblogs.com/walsky/p/5169295.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值