`
charrysong
  • 浏览: 50436 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

js取得屏幕高度与宽度

阅读更多
网页可见区域高: document.body.clientHeight
网页可见区域高: document.body.offsetHeight (包括边线的高)
网页正文全文高: document.body.scrollHeight
屏幕分辨率的高: window.screen.height
屏幕可用工作区高度: window.screen.availHeight网页可见区域宽: document.body.clientWidth

网页可见区域宽: document.body.offsetWidth (包括边线的宽)
网页正文全文宽: document.body.scrollWidth
网页被卷去的高: document.body.scrollTop
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop
网页正文部分左: window.screenLeft
屏幕分辨率的宽: window.screen.width
屏幕可用工作区宽度: window.screen.availWidth
分享到:
评论

相关推荐

    javascript获取和判断浏览器窗口、屏幕、网页的高度、宽度等

    scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离scrollWidth:获取对象的滚动宽度offsetHeight:获取对象相对于...

    js取得DIV的top,left,width,height值.doc

    同样,`offsetWidth`和`offsetHeight`包含元素的总宽度和高度,包括边框。 ```javascript console.log("offsetTop:", myDiv.offsetTop); console.log("offsetLeft:", myDiv.offsetLeft); console.log(...

    取得窗口大小 兼容所有浏览器的js代码.docx

    `window.innerWidth`和`window.innerHeight`是JavaScript提供的两个内置属性,它们分别用于获取浏览器视口的宽度和高度,但这些属性并不总是在所有浏览器中表现一致,尤其是在旧版本的浏览器中。因此,我们需要编写...

    js使用小技巧

    s += " 屏幕可用工作区高度:"+ window.screen.availHeight; s += " 屏幕可用工作区宽度:"+ window.screen.availWidth; //过滤数字 <input type=text onkeypress="return event.keyCode>=48&&event.keyCode||...

    useful-JavaScript-Fragment:前端常用JavaScript片段

    然后设置该副本的高度等于0,取得其宽度。又将其绝对定位到屏幕之外,以获取其高度。可以准确获得宽度值没有设置时的元素的大小。避免了网上常见的获取display:none元素的宽高时因盲目使待获取元素脱离文本流而导致...

    仿Google输入+取得控件绝对位置+text的正下方左对齐+可编辑下拉框

    在JavaScript中,我们可以使用HTML5的`<input>`元素来创建基础的文本输入框,然后通过CSS来定制样式,如圆角、边框宽度、背景色等,使其与Google的风格保持一致。 2. **取得控件绝对位置**:在JavaScript中获取控件...

    程序天下:JavaScript实例自学手册

    2.7 取得控件的绝对位置 2.8 删除时的确认提 示 2.9 按钮只能单击一次 2.10 防止按钮连击 2.11 图片式按钮 2.12 文字显示在按钮底部 2.13 选择不同的列表项就显示不同的按钮 2.14 使用按钮控制文本渐变 2.15 翻页...

    《程序天下:JavaScript实例自学手册》光盘源码

    2.7 取得控件的绝对位置 2.8 删除时的确认提示 2.9 按钮只能单击一次 2.10 防止按钮连击 2.11 图片式按钮 2.12 文字显示在按钮底部 2.13 选择不同的列表项就显示不同的按钮 2.14 使用按钮控制文本渐变 2.15 翻页效果...

    JS实现可关闭的对联广告效果代码

    `Toppx`、`AdDivW`、`AdDivH`、`PageWidth`和`MinScreenW`这几个变量分别代表了广告的上端位置、宽度、高度、页面宽度以及显示广告的最小屏幕宽度象素。`ClosebuttonHtml`是用于创建关闭按钮的HTML代码,通过内联...

    取得窗口大小 兼容所有浏览器的js代码

    例如,多数浏览器支持`window.innerWidth`和`window.innerHeight`属性,这些属性返回视口的宽度和高度。然而,在一些旧版本的浏览器中,如Internet Explorer的早期版本,并不支持这两个属性,我们需要使用其他属性来...

    web前端使用的产品图片

    图片URL" alt="替代文本" width="宽度" height="高度"> ``` 这里的`src`属性是必须的,用来指定图片的URL,可以是相对路径或绝对路径。`alt`属性提供了图片的描述,当图片无法显示或用户禁用了图片时,这个描述会...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    Activity Activity是一个应用程序组件,提供一个屏幕,用户可以用来交互为了完成某项任务,是一个负责与用户交互的组件 SSH 为 Struts+Spring+Hibernate的一个集成框架,是目前较流行的一种Web应用程序开源框架。...

    HTML考试必备

    4. **图片大小变化**:HTML的`<img>`标签允许我们设置宽度和高度属性,如`width`和`height`,来控制图片的尺寸。在响应式设计中,`<img>`的`srcset`属性可以根据设备像素比提供不同尺寸的图片。CSS的`object-fit`...

    HTML5和CSS3让网页设计提升到下一个高度

    - 媒体查询:允许根据设备的物理特性(如宽度、高度、颜色深度)来应用不同的样式,适应移动设备和桌面设备。 - 动画和过渡:通过`@keyframes`规则创建复杂的动画效果,`transition`属性实现元素状态改变时的平滑...

    大学计算机考试试题.pdf

    1. 自由延伸表格的设置:表格的宽度和高度设置为百分比(100%)可以让表格根据容器自动扩展,适应不同的屏幕尺寸。 2. 超链接的作用:超链接是网页间相互连接的桥梁,通过点击链接,用户可以跳转到其他网页,这是...

    15天学会jQuery-Css.rar

    2. **盒模型**:理解CSS的盒模型是至关重要的,它决定了元素的宽度、高度以及边距和内填充的计算方式。掌握盒模型有助于精确控制元素的尺寸和位置。 3. **浮动与定位**:浮动(float)和绝对定位(position)是实现...

    超实用的jQuery代码段

    超实用的jQuery代码段精选近350个jQuery代码段,涵盖页面开发中绝大多数要点、技巧与方法,堪称史上最实用的jQuery代码参考书,可以视为网页设计与网站建设人员的好帮手。《超实用的jQuery代码段》的代码跨平台、跨...

    业务团队展示响应式网页模板

    媒体查询允许开发者根据设备的特性,如宽度、高度或像素密度,来应用不同的CSS样式。流式布局则确保网页元素能够按比例缩放,保持整体布局的和谐统一。 在“业务团队展示”这个场景下,模板通常会包含以下几个关键...

    项目活动动态展示响应式网页模板

    - **媒体查询**:CSS3的媒体查询是实现响应式设计的核心,根据设备的特性(如宽度、高度)应用不同的样式。 - **弹性布局**(Flexbox)或**网格布局**(Grid):这两种布局模型可以帮助创建灵活的容器,其内容能在...

    企业团队产品说明响应式网页模板

    媒体查询允许设计师根据设备的物理特性(如宽度、高度或方向)来应用不同的CSS样式,而弹性网格布局则利用百分比或相对单位而非固定像素,使得网页元素能够按比例缩放。可缩放矢量图形(SVG)则确保图形在放大或缩...

Global site tag (gtag.js) - Google Analytics