1. let _this=this
  2. let height=""
  3. const query = uni.createSelectorQuery()
  4. query.select('#u-dropdown').boundingClientRect()
  5. query.selectViewport().scrollOffset()
  6. query.exec(function(res){
  7. // debugger
  8. res[0].top // #the-id节点的上边界坐标
  9. res[1].scrollTop // 显示区域的竖直滚动位置
  10. // _this.height=res.windowHeight-res[0].top +'px'
  11. // =_this.height
  12. height=uni.getSystemInfoSync().screenHeight
  13. _this.viewHeight=height-res[0].top-res[0].height
  14. _this.contentStyle={
  15. zIndex: -1,
  16. opacity: 0,
  17. height:_this.viewHeight+'px'
  18. }
  19. // console.log('打印高度',_this.viewHeight);
  20. // console.log('打印demo的元素的信息',res);
  21. })
  22. }

  

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. 树状图展示终端目录内容-tree

    以树状图列出目录的内容,让你一目了然 执行 tree 指令,它会列出指定目录下的所有文件,包括子目录里的文件. 安装 我们通过包管理工具可以方便的安装它 mac - brew install tree ...

  2. 小白学习Python之路---py文件转换成exe可执行文件

    一.背景 今天闲着无事,写了一个小小的Python脚本程序,然后给同学炫耀的时候,发现每次都得拉着其他人过来看着自己的电脑屏幕,感觉不是很爽,然后我想着网上肯定有关于Python脚本转换成可执行文件的 ...

  3. Loss 总结:IoU loss总结

    object detection 损失:更加接近人眼的损失 what is IoU 如果两个框没有相交,根据定义,IoU=0,不能反映两者的距离大小(重合度).同时因为loss=0,没有梯度回传,无法 ...

  4. jQuery 基本用法

    1)页面加载完成后开始运行do stuff when DOM is ready 中的语句! $(document).ready(function() { // do stuff when DOM is ...

  5. MySQL数据库——数据约束

    1 什么数据约束 对用户操作表的数据进行约束 2 默认值(缺省约束) 作用: 当用户对使用默认值的字段不插入值的时候,就使用默认值. 注意: 1)对默认值字段插入null是可以的 2)对默认值字段可以 ...

  6. java引用数据类型之Scanner与Random

    一 Scanner类 引用数据类型的使用 与定义基本数据类型变量不同,引用数据类型的变量定义及赋值有一个相对固定的步骤或格式. 数据类型  变量名  =  new 数据类型(); 每种引用数据类型都s ...

  7. super与this的区别,更进一步的区别!——Java学习

    文章目录 this与super的含义 前言 例证 this super 总结 this与super的含义 在Java中,this有两层含义: 指示隐式参数的引用(就是当前对象的引用) 调用该类的其他构 ...

  8. SourceTreet提交时显示remote: Incorrect username or password ( access token )(4种解决办法)

    引言 我因为第一次安装Sources Tree的时候进行破解时(跳过安装时的登录),因为操作失误造成了好多bug,导致Sources Tree不论提交,拉取,获取,都会报remote: Incorre ...

  9. python设计模式之模板模式

    python设计模式之模板模式 编写优秀代码的一个要素是避免冗余.在面向对象编程中,方法和函数是我们用来避免编写冗余代码的重要工具. 现实中,我们没法始终写出100%通用的代码.许多算法都有一些(但并 ...

  10. noip复习——线性筛(欧拉筛)

    整数的唯一分解定理: \(\forall A\in \mathbb {N} ,\,A>1\quad \exists \prod\limits _{i=1}^{s}p_{i}^{a_{i}}=A\ ...