软件 聊天 安全 视频 浏览器 下载 系统 办公 教学 输入法
免费 域名 空间 相册 邮箱 资源 网赚 试用 优惠 工具
教程 设计 三维 学院 办公 网页
素材 PSD 矢量 网页 PPT 动画
美女 唯美 大生活 美图 风景 时尚艺
资讯 新闻 专题 热点
您的位置: 广信之家 > 免费资源 > 免费插件 > 文章正文

一个页面内滚动的jQuery插件 - PageScroller

时间:02-29 15:54 来源:gbin1.com 整理:广信小编 我要评论(0)
字号:T|T
内容提要:
  今天介绍一款页面内滚动的jQuery插件-pagescroller,以前我们也介绍过类似的jQuery插件 jQuery的滚动插件Waypoints。

一个页面内滚动的jQuery插件 - PageScroller

今天介绍一款页面内滚动的jQuery插件-pagescroller,以前我们也介绍过类似的jQuery插件 jQuery的滚动插件Waypoints。

主要特性:

支持缺省方式左侧导航

支持向上及其向下滚动图标,支持俩个主题

支持顶端固定导航菜单

支持右侧导航

支持IE9+,firefox,chrome等浏览器

如何使用?

倒入相关类库

定义滚动区域:$('#wrapper').pageScroller()

一个页面内滚动的jQuery插件 - PageScroller

Javascript

$(document).ready(function(){
 
 // instantiate page scroller plugin
 
 var navLabel = new Array('Introduction', 'How It Works', "What's Included?", 'Documentation', 'Download Plugin');
 
 $('#main').pageScroller({ navigation: navLabel });
 
 /* AVAILABLE OPTIONS:
  * currentSection     starting position
  * sectionClass    class of each section
  * navigationClass    navigation element class
  * scrollOffset    offset target area from top of section
  * animationSpeed     change duration of animation in miliseconds
  * animationBefore     callback: assign a function before animation
  * animationComplete     callback: assign a function after animation
  * onChange     callback: assign a function for when section changes
 */  
 
 // assigns "next" API function to button
 
 $('.next').click(function(e){
  e.preventDefault();
  pageScroller.next();
 });
 
 //assigns "prev" API function to button 
  
 $('.prev').click(function(e){
  e.preventDefault();
  pageScroller.prev();
 });
 
 $('.jumpTo').click(function(e){
  e.preventDefault();
  pageScroller.goTo(4);
 });
    
});

来源:一个页面内滚动的jQuery插件 - PageScroller

    相关阅读:

    顶一下
    (0)
    0%
    踩一下
    (0)
    0%
    免责申明:以上内容仅代表原创者观点,其内容未经本站证实,一个页面内滚动的jQuery插件 - PageScroller对以上内容的真实性、完整性不作任何保证或承诺,转载目的在于传递更多信息,由此产生的后果与一个页面内滚动的jQuery插件 - PageScroller无关;如以上转载内容不慎侵犯了您的权益,请联系我们将会及时处理。
    [责任编辑:广信小编]

    精彩图文

    登录 (请登录发言,并遵守 相关规定)
    如果你对广信之家有任何意见或建议,请到交流平台反馈。到留言板反馈