let _this=this
let height=""
const query = uni.createSelectorQuery()
query.select('#u-dropdown').boundingClientRect()
query.selectViewport().scrollOffset()
query.exec(function(res){
// debugger
res[0].top // #the-id节点的上边界坐标
res[1].scrollTop // 显示区域的竖直滚动位置
// _this.height=res.windowHeight-res[0].top +'px'
// =_this.height
height=uni.getSystemInfoSync().screenHeight
_this.viewHeight=height-res[0].top-res[0].height
_this.contentStyle={
zIndex: -1,
opacity: 0,
height:_this.viewHeight+'px'
}
// console.log('打印高度',_this.viewHeight);
// console.log('打印demo的元素的信息',res);
})
}

  

uniapp 获取元素高度 距离顶部高度等的更多相关文章

  1. jquery获取元素到页面顶部距离

    jquery获取元素到页面顶部距离的语句为: $(selector).offset().top

  2. 使用jQuery获取元素的宽度或高度的几种情况

    今天说说使用jQuery获取元素大小的遇到几种情况 使用jQuery获取元素的宽度或高度的有几种情况: 1.使用width(),它只能获取当前元素的内容的宽度: 2.使用innerWidth(),它只 ...

  3. JS获取滚动条距离顶部高度

    一.jQuery获取的相关方法 jquery 获取滚动条高度 获取浏览器显示区域的高度 : $(window).height(); 获取浏览器显示区域的宽度 : $(window).width(); ...

  4. scroll 方法 获取滚轴距离顶部高度

    $(window).scroll(function(){ var supportPageOffset = window.pageXOffset !== undefined; // 判断是否支持page ...

  5. uni-app获取元素宽高封装

    getElSize(id) { //得到元素的size return new Promise((res, rej) => { uni.createSelectorQuery().select(' ...

  6. 获取Javascript 滚动条距离顶部的距离(兼容IE6+,火狐,谷歌,其它没测)

    document.body.scrollTop || document.documentElement.scrollTop

  7. jquery获取元素与屏幕高度距离

    a. onscroll事件 scroll是css样式中overflow的一个值,意思是显示滚动条;当一个元素的实际高度超过他的最大高度是,只要设置了overflow为scroll b. $(..).s ...

  8. js计算元素距离顶部的高度及元素是否在可视区判断

    前言: 在业务当中,我们经常要计算元素的大小和元素在页面的位置信息.比如说,在一个滚动区域内,我要知道元素A是在可视区内,还是在隐藏内容区(滚动到外边看不到了).有时还要进一步知道,元素是全部都显示在 ...

  9. jquery获取元素到屏幕底的可视距离

    jquery获取元素到屏幕底的可视距离 要打对号的图里的height(我自称为可视高度:滚动条未滑到最底端)  不是打叉图里的到页面底部(滚动条到最底部时的height)(offset().top方法 ...

随机推荐

  1. 深度学习模型调优方法(Deep Learning学习记录)

    深度学习模型的调优,首先需要对各方面进行评估,主要包括定义函数.模型在训练集和测试集拟合效果.交叉验证.激活函数和优化算法的选择等. 那如何对我们自己的模型进行判断呢?——通过模型训练跑代码,我们可以 ...

  2. Python人脸识别 + 手机推送,老板来了你就会收到短信提示

  3. Web接口测试理论知识分享

    首先谈下接口的定义分为2类,程序接口和协议接口 1.程序模块接口,具体到程序中就是提供了输入输出的类 方法,我们可以通过传入不同的参数,来验证程序接口的功能 2.协议接口  比如HTTP/SOAP协议 ...

  4. 树上的等差数列 [树形dp]

    树上的等差数列 题目描述 给定一棵包含 \(N\) 个节点的无根树,节点编号 \(1\to N\) .其中每个节点都具有一个权值,第 \(i\) 个节点的权值是 \(A_i\) . 小 \(Hi\) ...

  5. Spring - RestTemplate执行原理分析

    什么是RestTemplate Synchronous client to perform HTTP requests, exposing a simple, template method API ...

  6. 阿里P8架构师大话设计模式,体会乐与怒的程序人生中值得回味一幕

    本书特色 本书有两个特色,第一特色是重视过程.看了太多的计算机编程类的图书,大多数书籍都是集中在讲授优秀的解决方案或者一个完美的程序样例,但对这些解决方案和程序的演变过程却重视不够,好书之所以好,就是 ...

  7. String、StringBuilder、StringBuffer三者的区别

    StringBuffer.StringBuilder和String都可以用来代表字符串.String类是不可变类,任何对String的改变都会引发新的String对象的生成:StringBuffer. ...

  8. 9.oracle表查询关键字

    1.使用逻辑操作符号问题:查询工资高于500或者是岗位为manager的雇员,同时还要满足他们的姓名首字母为大写的J? select * from emp where (sal > 500 or ...

  9. 2.Oracle数据库安装教程

    一.准备安装 基本都是按部就班. 使用的OS版本:OEL4 安装程序路径: /mnt/Oracle11g_linux_x86_64/database 创建用户 使用的.bash_profile 修改的 ...

  10. hdfs-default.xml

    <?xml version="1.0"?> <?xml-stylesheet type="text/xsl" href="confi ...