网页特效栏目收集了最全最新的前端网页插件,包括最流行的jQuery,Bootstrap,Js,Css,Vue等主流特效插件。
vue-scroll-snap是Vue.js的一个组件,用于创建具有监听滚动功能的单页滚动网站或单页Web应用程序。在滚动页面时,页面将自动监听到下一个或上一个页面部分。
1.导入并注册组件。
import VueScrollSnap from "vue-scroll-snap";
export default {
components: {VueScrollSnap},
};
2.在您的应用程序模板中创建组件,然后将页面部分插入文档中。
<template>
<vue-scroll-snap>
<div class="item"></div>
<div class="item"></div>
...
</vue-scroll-snap>
</template>
3.启用全屏页面滚动。
<template>
<vue-scroll-snap :fullscreen="true">
<div class="item"></div>
<div class="item"></div>
...
</vue-scroll-snap>
</template>
4.启用水平页面滚动。
<template>
<vue-scroll-snap :horizontal="true">
<div class="item"></div>
<div class="item"></div>
...
</vue-scroll-snap>
</template>
转载请注明来源:vue页面滚动监听组件(vue-scroll-snap)
本文永久链接地址:https://www.moyouyouw.cn/code/1168.html
郑重声明:本站所有主题/文章除标明原创外,均来自网络转载,版权归原作者所有,如果有侵犯到您的权益,请联系本站删除,谢谢!我们不承担任何技术及版权问题,且不对任何资源负法律责任。
已有 位小伙伴发表了看法
欢迎 你 发表评论