scrollToSmooth.js是一个纯JS平滑滚动动画,页面滚动到指定的锚点链接。适用于粘性的导航栏。
引用js类库
<script src="./dist/scrolltosmooth.js"></script>创建锚点标记
<nav> <a href="#section-1">Section 1</a> <a href="#section-2">Section 2</a> <a href="#section-3">Section 3</a> <a href="#section-4">Section 4</a> <a href="#section-5">Section 5</a> </nav>初始化调用插件
var smoothScroll = new scrollToSmooth('a') smoothScroll.init();可以指定动画时间
var smoothScroll = new scrollToSmooth('a',{ duration: 500 })还能指定动画效果
var smoothScroll = new scrollToSmooth('a',{ easing: "linear" //linear easeInQuad easeOutQuad easeInOutQuad easeInCubic easeOutCubic easeInOutCubic easeInQuart easeOutQuart easeInOutQuart easeInQuint easeOutQuint easeInOutQuint easeInSine easeOutSine easeInOutSine easeInExpo easeOutExpo easeInOutExpo easeInCirc easeOutCirc easeInOutCirc easeInElastic easeOutElastic easeInOutElastic easeInBack easeOutBack easeInOutBack easeInBounce easeOutBounce easeInOutBounce })
回调方法
var smoothScroll = new scrollToSmooth('a',{ callback: function () { console.log('we reached it!'); } })
scrollToSmooth.js锚点滚动插件右侧圆点
正在加载文件目录...
- 热度 10
百度收藏了 此素材
灌汁豆腐下载了 此素材
月光海岸下载了 此素材
BSAND1下载了 此素材
千与下载了 此素材
LOADING下载了 此素材
介素下载了 此素材
Tan下载了 此素材
我是传琪下载了 此素材
theshy的女朋友下载了 此素材