您现在的位置是：网站首页>前端技术>uniappuniapp

uni-app获取dom元素到顶部的距离

神夜2020-10-30 10:01:42【uniapp】4171人已围观文章来源：神夜个人博客

简介

一、

1、首先有一个元素

<view class="activity" ref="btn"></view>

2、确认指针指向

this.$refs.btn.$el.getBoundingClientRect()

例：

打印出：

可获得用于描述边框的只读属性——left、top、right、bottom等，单位为像素。除了 width 和 height 外的属性都是相对于视口的左上角位置而言的。

操作样式：

this.$refs.btn.$el.style.position = 'fixed' this.$refs.btn.$el.style.top = 0;

二、

如果想要滚动到指定位置

1、首先有一个元素

<view class="sticke"></view>

uni.createSelectorQuery().select(".sticke").boundingClientRect((res)=>{
    uni.pageScrollTo({
        duration:0,
        scrollTop:800 })
}).exec()

使用 uni.createSelectorQuery 方法查找元素，使用 uni.pageScrollTo 方法使其滚动到相应位置（scrollTop），

duration 在我使用过程中，设置除0以外其他数字均在第一次滚动后报错，所以最好还是设置为0。