vue 滚动到指定位置

素颜马尾好姑娘i 2022-11-05 07:30 192阅读 0赞

## 效果图： ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDE3MTc1Nw_size_16_color_FFFFFF_t_70]

### 核心代码：document.getElementById(‘test2’).scrollIntoView() ###

<div class="infoBox" ref="infoBox" style="height: 300px;overflow: auto">
            <div v-html="info"></div>
          </div>

this.info = '<div>\n' +
            ' <p>1------java执行信息1</p>\n' +
            ' <p>1------java执行信息1</p>\n' +
            ' <p>1------java执行信息1</p>\n' +
            ' <p>1------java执行信息1</p>\n' +
            ' </div>\n' +
            ' <div id="test2">\n' +
            ' <p>2------java执行信息2</p>\n' +
            ' <p>2------java执行信息2</p>\n' +
            ' <p>2------java执行信息2</p>\n' +
            ' <p>2------java执行信息2</p>\n' +
            ' <p>2------java执行信息2</p>\n' +
            ' <p>2------java执行信息2</p>\n' +
            ' </div>\n' +
            ' <div id="test3">\n' +
            ' <p>3------java执行信息3</p>\n' +
            ' <p>3------java执行信息3</p>\n' +
            ' <p>3------java执行信息3</p>\n' +
            ' <p>3------java执行信息3</p>\n' +
            ' <p>3------java执行信息3</p>\n' +
            ' <p>3------java执行信息3</p>\n' +
            ' </div>'
        this.$nextTick(() => { 
          document.getElementById('test2').scrollIntoView()  //滚动到指定位置
        })

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDE3MTc1Nw_size_16_color_FFFFFF_t_70]: /images/20221023/d14da6d817ea40aaab3f4dbbdb85fec5.png

发表评论取消回复

表情：

评论列表（有 0 条评论，192人围观）

还没有评论，来说两句吧...

相关阅读

相关设置scrollView滚动到指定位置

//设置scroll滚动到指定位置 [_scroll setContentOffset:CGPointMake((float)Wi/3i,0) animated

àì夳堔傛蜴生んèń/ 2023年10月17日 09:07/ 0 赞/ 86 阅读

相关 html5滚动到指定元素位置

滚动到页面指定元素 window.requestAnimationFrame // h5 function scrollToElement(elem

迷南。/ 2022年12月20日 01:51/ 0 赞/ 351 阅读

相关页面刷新后滚动条部分默认滚动到指定位置

列表页面进入详情页面，在列表页点击靠后的图片，进入详情页之后左侧有个列表滚动区域，在该区域让该图片默认指定。接口异步返回后，数据处理完成后，设置一个setTimeout（）

╰半橙微兮°/ 2022年11月28日 13:20/ 0 赞/ 204 阅读

相关 vue 滚动到指定位置

效果图： ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nL

素颜马尾好姑娘i/ 2022年11月05日 07:30/ 0 赞/ 193 阅读

相关 vue 吸顶效果，开始随页面滚动，滚动到指定位置固定在顶部或者固定在指定位置

首先找到需要加吸顶的元素加上id和样式我这里是给页面左侧导航加吸顶，在外层div加id,里层div加样式 <div class="asset-main-

ゞ浴缸里的玫瑰/ 2022年08月31日 14:27/ 0 赞/ 179 阅读

相关 js 滚动到指定位置

goTo = function(target){ var scrollT = document.body.scrollTop||

- 日理万妓/ 2022年05月09日 17:54/ 0 赞/ 210 阅读

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

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9f

川长思鸟来/ 2022年04月02日 12:58/ 0 赞/ 776 阅读

相关页面滚动至指定位置

方法一：锚点定位 <a href="B">B</a> //点击此处将跳转至设置的ID为B的锚点 <div id="B">B</div>

你的名字/ 2022年02月17日 19:23/ 0 赞/ 369 阅读

相关 a标签滚动页面到指定位置

[qnx使用实战培训，日入过万，马上来试试。>>> ][qnx_] ![hot3.png][] a标签滚动页面到指定位置的方法 <a href='javascr

╰半橙微兮°/ 2021年12月11日 00:34/ 0 赞/ 531 阅读

相关小程序滚动到指定位置scroll-into-view

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JyaWdo

淩亂°似流年/ 2021年10月18日 22:32/ 0 赞/ 1155 阅读