前言:
如今看官们对“scroll组件”可能比较关切,兄弟们都需要知道一些“scroll组件”的相关资讯。那么小编在网络上收集了一些有关“scroll组件””的相关知识,希望朋友们能喜欢,小伙伴们一起来了解一下吧!今天给大家推荐一款 vue.js 顺滑动画滚动到页面指定位置组件VueScrollTo。
vue-scrollto 一个定位滚动条滚动至当前元素位置组件。支持按 x轴 或 y轴 滚动,可以嵌套元素,当前元素在父元素中滚动。
安装
$ npm install --save vue-scrollto
引入插件
import Vue from 'vue'import VueScrollTo from 'vue-scrollto'Vue.use(VueScrollTo)// You can also pass in the default optionsVue.use(VueScrollTo, { container: "body", duration: 500, easing: "ease", offset: 0, force: true, cancelable: true, onStart: false, onDone: false, onCancel: false, x: false, y: true})
使用
<a href="#" v-scroll-to="'#element'">Scroll to #element</a><div id="element"> Hi. I'm #element.</div><!--自定义参数配置--><a href="#" v-scroll-to="{ el: '#element', container: '#container', duration: 500, easing: 'linear', offset: -200, force: true, cancelable: true, onStart: onStart, onDone: onDone, onCancel: onCancel, x: false, y: true}"> Scroll to #element</a>
最后附上文档及项目地址
# 文档地址 仓库地址
okay,就分享到这里,感谢你的阅读。如果对大家有帮助,记得多支持一下哈~~
版权声明:
本站文章均来自互联网搜集,如有侵犯您的权益,请联系我们删除,谢谢。
标签: #scroll组件