jQuery平滑页面滚动插件:jquery.smoothPageScroll

jQuery平滑页面滚动插件:smoothPageScroll

jquery.smoothPageScroll是一个轻量级的jQuery页面滚动插件,点击锚链接让对应的网页平滑滚动。支持水平,垂直和对角线滚动效果。

使用方法

1. 在页面底部引入jQuery库和jQuery smoothPageScroll 插件脚本文件

<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="jquery.smoothPageScroll.js"></script>

2. 引入jQuery easing 插件

<script src="jquery.easing.1.3.min.js"></script>

3. 创建一个锚链接指向一个你想滚动到的页面

<a href="#section">Link</a>

<div id="section">
  ...
</div>

4.通过回调函数激活插件

$('a[href^="#"]').smoothPageScroll();

5.默认配置选项

$('a[href^="#"]').smoothPageScroll({

  // easing type
  easing: 'easeOutQuart',

  // scrolling speed
  speed: 1000,

  // scrolling delay
  delay: 0,

  // specify the target container
  target: undefined,

  // fired after the scroll is complete
  complate: function (){},

  // add hash to url
  isAddHash: true,

  // vertical scroll
  isTopScroll: true,

  // horizontal scroll
  isLeftScroll: true
  
});
打赏
下载 在线预览 积分 (-2) 吐槽 (6)
×
加载中,请稍候…

您需要 登录 后才能发表评论。

avatar

- 评论

  • 加载中,请稍候…
我要吐槽