首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js获取各种高度总结

在写js的时候偶尔需要获取各种高度,比如;浏览器高度,页面高度,滚动高度等。抽空整理了我自己常用到的,时间仓促,没有考虑到万恶的IE浏览器。。。。...获取屏幕的高度和宽度(屏幕分辨率): window.screen.height window.screen.width 获取屏幕工作区域的高度和宽度(去掉状态栏): window.screen.availHeight...window.screen.availWidth 网页全文的高度和宽度: document.body.scrollHeight document.body.scrollWidth 滚动条卷上去的高度和向右卷的宽度...: document.body.scrollTop document.body.scrollLeft 网页可见区域的高度和宽度(不加边线): document.body.clientHeight document.body.clientWidth...网页可见区域的高度和宽度(加边线): document.body.offsetHeight document.body.offsetWidth

12.6K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    overflow和动态计算高度

    重点在这里: 为使 overflow有效果,块级容器必须有一个指定的高度(height或者max-height)或者将white-space设置为nowrap。...那问题来了,我这里有一个折叠面板 我希望这里多个折叠面板每一项的头部都能显示在页面中,并且其子项能够适应屏幕高度和折叠情况变化 为了实现上面的效果,我们需要在每一个折叠面板子项中设置overflow-y...:auto,然后给其设置height或者max-height 我们知道css中有个计算函数calc可以计算我们的高度,这里的卡片为了保证屏幕自适应,可以用其计算出我们这里所需的高度为100vh(屏幕可视区域高度...)-其余占位高度(比如卡片上下的留白,卡片头部的高度等),最后需要除以这里的折叠面板数量3,但有个问题,这里不一定是3个,有可能是多个,使用vue动态渲染的,这样的话我们就只能在vue标签上指定高度 例如

    1.3K20

    LinearLayout.onMesaure-计算LinearLayout的高度

    resolveSizeAndState(heightSize, heightMeasureSpec, 0); heightSize = heightSizeAndState & MEASURED_SIZE_MASK; 以上代码为计算...LinearLayout总高度的代码 判断useLargestChild,如果标识位为true的话,说明这是使用最大的子View的高度来作为自己的高度,从判断可以看出,只有当heightMode不是MeasureSpec.EXACTLY...的时候,才会走这个判断,意味着,如果不是EXACTLY的话,那么LinearLayout就是可变的了 接着就将mTotalLength置为0,会遍历所有的子View将最大子View的高度赋给mTotalLength...变量,也就是用最大高度的子View来做自己的高度 将子View的高度再加上上下的padding,获得所需要的总高度 判断background中Drawable的高度和所需总高度比,拿最大的那个做为所需要的总高度...通过resolveSizeAndState来获取LinearLayout的高度以及状态 通过位运算获取高度

    66110

    p5.js 使用npm安装p5.js后如何使用?

    ---- 本文简介 点赞 + 关注 + 收藏 = 学会了 在 《p5.js 光速入门》 中都是使用 CDN 的方式去使用 p5.js 的,不太符合当下的开发习惯。...安装 p5.js 进入 p5-demo 项目后,使用以下命令安装 p5.js npm install p5 --save 安装完成后再使用 npm run dev 运行项目。...创建画布 在创建画布前,需要先引入 p5.js。引入后可以尝试输出 p5.js 的版本。...打开 main.js 输入以下内容 import p5 from 'p5' // 引入 p5 console.log(p5.VERSION) // 输出当前使用 p5.js 的版本 打开浏览器的控制台可以看到当前使用的...p5.js 版本,在写本文时所用的是 v1.5.0 此时如果你打算像 《p5.js 光速入门》 那样直接使用 setup() 创建画布是不可能的了,因为在 module 模式下引入的 p5.js

    2.6K10

    统计| p值的计算

    p值的计算,R语言和python的实现 今天来说说频率中假设检验要依赖的评估指标:p值,对,你也许很清楚的知道它表达的意思,但是它是怎么算得的呢?不知道你是否知道呢?...这次将介绍几种分布计算p值的方法(套路)。 这里以两样本均值的假设检验为例来说明。...,原假设发生的概率,若是p值小于0.05,发生概率小于0.05时,认为是小概率发生了,即是差异性显著,拒绝原假设。...公式: 双边假设的p值: p=P(z<−|x¯−y¯S2xn+S2ym−−−−−−−√|) p = P( z < -| \frac{ \overline{x} - \overline{y...= 2*pnorm(-abs(z)) > p 结果: [1] 1.608277e-05 2、小样本情况下: 方差相等 方差不等 方差相等时, 方差不等时: > m1 <- c(10) > m2 <-

    3.1K20

    p5.js map映射

    本文简介 p5.js 为开发者提供了很多有用的方法,这些方法实现起来可能不难,但却非常实用,能大大减少我们的开发时间。 本文将通过举例说明的方式来讲解 映射 map() 方法。...什么是映射 从 p5.js 文档 中可以看到对映射的说明 说明:从一个范围内映射一个数字去另一个范围。 好家伙,使用映射来说明映射。...根据比例来计算,绿线上的点可以在红线上转换成对应的点。 map() 语法 除了普通的映射规则外,p5.js 的 map() 方法还提供了映射后最大值和最小值的限制。...我在 《# p5.js 光速入门》 里有讲到。 再举个例子 根据当前鼠标所在位置x轴设置画布背景色的色调,根据鼠标所在位置y轴设置画布背景色的饱和度。....js 提供的环境变量。

    3.7K51

    p5.js 光速入门

    于是,p5.js 应运而生! p5.js 第一个测试版在 2014年8月 发布。 更多的故事可在 p5.js 官网 中寻找,本文的目标是光速入门 p5.js 。...找到 p5.js p5.js 官网 p5.js github地址 p5.js npm地址 快速上手 本文的目标是和各位工友快速上手 p5.js,所以 CDN 的方式引入 p5.js,因为这样非常快!...语法如下: ellipse(x, y, w, [h]) x 和 y 确定了椭圆的圆心 w 椭圆在x轴的宽度 h 椭圆在y轴的高度 如果只传3个参数,h 会取 w 的值,所以画出来的是正圆形。...先来看看语法: arc(x, y, w, h, start, stop, [mode], [detail]) x 和 y: 圆弧的圆心坐标 w : x轴方向的宽度 h: y轴方向的高度 start: 弧形开始的角度...语法如下: text(str, x, y, [x2], [y2]) str: 文本 x 和 y 是文本基线左侧的坐标 x2 和 y2 定义文本内容占用的面积,x2 表示宽度,y2 表示高度

    5.2K41
    领券