vue 滚动条到顶部或者到指定位置

已于 2024-05-06 22:44:14 修改
阅读量3.7w 收藏 12
点赞数 3
分类专栏： vue es6 文章标签： vue滚动条
于 2018-12-26 17:52:30 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Hero_rong/article/details/85266269
版权
vue 同时被 2 个专栏收录
53 篇文章 1 订阅
订阅专栏
es6
18 篇文章 1 订阅
订阅专栏

首先在 html 里面给你要滚动的元素设置属性 ref='box' 这就相当于是DOM操作了 ，

然后 根据 属性名找到则个元素就可以操作啦，嘻嘻

Hero_rong
关注
专栏目录
vue 网页滚动到指定位置显示动画效果
sinat_41657240的博客
04-12 6606
网页视觉差效果，滚动动画
vue 移动端吸顶效果，开始随页面滚动，滚动到指定位置固定在顶部或者固定在指定位置
好巧的博客
12-05 1万+
当然，如果你觉得文章有什么让你觉得不合理、或者有更简单的实现方法又或者有理解不来的地方，希望你在看到之后能够在评论里指出来，我会在看到之后尽快的回复你。不同组件多次使用的话，建议在 src 下新建一个 common 文件夹，创建 stickySlot.vue 文件，方便多次复用。为了方便演示，这里使用了for循环的方法将屏幕撑满，直接将全部代码复制运行就能看到效果。通过设置top的值，控制需要固定在什么位置，0是顶部，值为number(px)// 需改为对应的组件存放的路径。// 使用假数据撑满屏幕。
vue页面滚动到指定位置
Dawnchen1的博客
09-08 4076
vue页面滚动到指定位置一看就懂 话不多说，直接上代码 HTML部分 <div> <button @click="jump()">跳转</button> </div> <div id="map" style="width: 500px;height: 500px;"> this is map div </div> <div id="box" style="width: 500
Vue设置滚动条自动保持到最底端
最新发布
Lipn_的博客
08-09 1137
实现滚动条始终保持在最底端
Vue之点击滑动到页面指定位置（点击下滑滚动）
weixin_52418790的博客
11-13 1万+
三种方法 <div @click="go">点击下滑</div> <div id="show" ref="view">展示</div> 1、利用scrollIntoView()方法，该方法将调用它的元素滚动到浏览器窗口的可见区域（根据其他元素的布局，元素可能无法完全滚动到顶部或底部） ps：页面可滚动时才有用！！！ methods:{ go(){ document.getElementById("show").scrollIntoView
vue-scrollfire-在特定的滚动位置上触发事件。-Vue.js开发
05-27
vue-scrollfire在特定的滚动位置上触发事件演示安装npm install --save-dev vue-scrollfire // [受电子邮件保护] npm install --save-dev vue-s vue-scrollfire在特定的滚动位置上触发事件演示安装npm install --save-dev vue-scrollfire // // [受电子邮件保护] npm install --save-dev [受电子邮件保护]或包含build / bundle.js。 组件组件中的用法＃：“ scrollfire”：require（“ vue-scrollfire”）＃或在使用bundle.js组件时：“ scrollfire”：window.vueComps.scrollfire 有关示例，请参见dev /。 道具名称类型默认描述多个布尔假集
[vue] 页面滚动到指定位置 scrollIntoView
qq_14993591的博客
07-05 1348
滚动
vue 点击滑动到页面指定位置（点击下滑滚动）的功能
蓝胖子的博客
11-07 3888
vue 点击滑动到页面指定位置（点击下滑滚动）的功能
vue滚动到指定位置
qq_43610311的博客
11-14 739
前端滚动到指定位置
vue点击滚动到指定位置
jenesBangBang的博客
04-06 2142
offsetTop：元素的上边框与父元素的上边框的绝对距离。scrollTop：某个可滑动区块向下滚动的距离。
滚动页面到指定位置动画展示-Vue自定义命令-IntersectionObserver-animate.css
m0_71362881的博客
10-17 1195
滚动页面到指定位置动画展示-Vue自定义命令-IntersectionObserver-animate.css
基于vue实现滚动条滚动到指定位置对应位置数字进行tween特效
10-17
主要介绍了基于vue实现滚动条滚动到指定位置对应位置数字进行tween特效,本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
Vue列表如何实现滚动到指定位置样式改变效果
10-15
主要介绍了Vue列表实现滚动到指定位置样式改变效果，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
vue 滚动条滚动到指定位置（非平滑滚动）
Lei_Xue的博客
10-13 1934
方法1：scrollTop 滚动到某位置 document. documentElement. scrollTop = 380;// 直接跳转到380的高度不需要加单位 方法2：scrollTo，scrollBy，scroll滚动到某位置 //第一个坑,ref绑定的元素不能是display： // 第二要力口上this .nextTtch this.$nextTick(() => { this.$refs.DOM.scrollTo(0,380); )) 方法3：scrollInt
Vue：滚动页面到指定位置实现
weixin_39583421的博客
01-29 1万+
在Vue中，有三种方式可以实现H5页面滑动至指定位置 方法1： //先获取目标位置距离 mounted() { this.$nextTick(() => { setTimeout(() => { let targetbox= document.getElementById('targetbox'); this.target= targetbox.offsetTop; }) }) } //再滑动指定距离 document
vue让元素滚动到指定位置
蓦然回首，那人却在，灯火阑珊处。
01-13 1278
vue让元素滚动到指定位置
vue3 页面滚动到指定位置
qq_44871531的博客
04-23 1258
vue3 页面滚动到指定位置,类似游览器的ctrl+F的功能
vue平滑滚动到指定位置
Y丶小琪
03-09 2940
需求：锚点导航问题，点击导航跳到对应的模块，两种方式 1.滚动盒子滚动到指定高度 scrollTo（offsetTop每个模块顶部距离可滚动盒子的顶部偏移的像素值） goAnthor (selector) { const height = document.querySelector(selector).offsetTop const container = document.querySelector('.scroll-wrap') container.s
Vue滚动到指定位置的多种方式
热门推荐
qsya的博客
07-13 4万+
需求： 当容器有滚动条时，有时需要将指定的内容自动滚动到可视区域。 方法一：锚点 锚点通过在元素上设置id，然后用a标签的href="#id"属性跳转到指定位置。 也可以通过js中 window.location.hash= ‘#id’ 或 window.location.href = ‘#id’ 来跳转。 //dom <a href="#li50">跳到50</a> <ul class="ul" id="ul"> <li v-for
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值