zoukankan      html  css  js  c++  java
  • uni-app获取dom元素到顶部的距离以及操作dom元素的一些样式

    一、

    1、首先有一个元素

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

    2、确认指针指向

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

    https://developer.mozilla.org/zh-CN/docs/Web/API/Element/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。

  • 相关阅读:
    SCP-S模拟56 C题
    NOIP模拟测试22
    NOIP模拟测试21
    NOIP模拟测试20
    NOIP模拟测试19
    网络流24题
    NOIP模拟测试18
    NOIP模拟测试16
    那些年我们颓过的游戏
    csp2019游记
  • 原文地址:https://www.cnblogs.com/angenstern/p/11752432.html
Copyright © 2011-2022 走看看