javascript 中 offsetWidth 是什么意思?

最佳答案:是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变

scrollWidth,clientWidth与offsetWidth的区别

scrollWidth 是对象的实际内容的宽,不包边线宽度,会随对象中内容的多少改变(内容多了可能会改变对象的实际宽度)。clientWidth 是对象可见的宽度,不包滚动条等边线,会随窗口的显示大小改变。 offsetWidth 是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变。 一个scrollWidth和clientWidth的例子:

<DIV id=demo
                        style="OVERFLOW: hidden; WIDTH: 460px; COLOR: #ffffff; HEIGHT:

120px">
                        <DIV align=left>
                        <DIV align=left></DIV>
                        <TABLE height=120 cellPadding=0 width=600 align=right
                        border=0 cellspace="0">
                          <TBODY>
                          <TR>
                            <TD id=demo1 vAlign=top width=543>
                              <TABLE height=120 cellSpacing=0 cellPadding=0
                              width=543 border=0>
                                <TBODY>
                                <TR>
                                
                                <TABLE borderColor=#ffffff cellSpacing=2
                                cellPadding=0 width=50 border=1>
                                                   <TD></TR></TBODY></TABLE></TD>
                            <TD id=demo2 vAlign=top
                        width=47></TD></TR></TBODY></TABLE>
                        <SCRIPT>
var speed=1//速度数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)   /*scrollLeft 设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。*/
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.οnmοuseοver=function() {clearInterval(MyMar)}
demo.οnmοuseοut=function() {MyMar=setInterval(Marquee,speed)}
</SCRIPT>
                        </DIV></DIV>

clientWidth、offsetWidth、clientHeight..区别

2007-10-15 22:24
clientWidth、offsetWidth、clientHeight..区别 IE6.0、FF1.06+:
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = height + padding + border
IE5.0/5.5:
clientWidth = width - border
clientHeight = height - border
offsetWidth = width
offsetHeight = height
(需要提一下:CSS中的margin属性,与clientWidth、offsetWidth、clientHeight、offsetHeight均无关)

offsetwidth:是元素相对父元素的偏移宽度。等于border+padding+width
clientwidth:是元素的可见宽度。等于padding+width
scrollwidth:是元素的宽度且包括滚动部分。

来自: http://hi.baidu.com/%C7%A7%D4%D8%C6%DA%C5%CE/blog/item/1f8dfafd592e8e40d6887d12.html

javascript 中 offsetWidth 是什么意思?相关推荐

  1. JavaScript 中 offsetWidth,offsetHeight,clientWidth,clientHeight 等属性归纳

    offsetWidth 返回元素的宽度(包括元素宽度.内边距和边框,不包括外边距) offsetHeight 返回元素的高度(包括元素高度.内边距和边框,不包括外边距) clientWidth 返回元 ...

  2. javascript中获取dom元素高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight ...

  3. JavaScript中的各种宽高以及位置总结

    在javascript中操作dom节点让其运动的时候,常常会涉及到各种宽高以及位置坐标等概念,如果不能很好地理解这些属性所代表的意义,就不能理解js的运动原理,同时,由于这些属性概念较多,加上浏览器之 ...

  4. 详解 javascript中offsetleft属性的用法(转)

    详解 javascript中offsetleft属性的用法 转载  2015-11-11   投稿:mrr    我要评论 本章节通过代码实例介绍一下offsetleft属性的用法,需要的朋友可以做一 ...

  5. 如何在 JavaScript 中实现拖放

    来源:http://www.javaeye.com/post/152142 译者说明: 终于完成了全文的翻译,由于时间比较参促,文章没有过多的校正与润色,阅读过程中难免会有些许生硬或不准确的感觉,请大 ...

  6. 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理。距离远时图片放大,距离近时图片缩小

    查看本章节 查看作业目录 需求说明: 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理.距离远时图片放大,距离近 ...

  7. JavaScript中的拖拽事件且限制出界

    JavaScript中的拖拽事件限制出界 JavaScript事件中很多都会用到拖拽,而在现实中很多拖拽是会限制在浏览器界面禁止出界的,下面是封装好的限制出界的拖拽事件. function drag( ...

  8. javascript中定位父级offsetParent 及偏移大小

    偏移量(offset dimension)是javascript中一个重要的概念.javascript中涉及到偏移的有offsetWidth.offsetHeight.offsetLeft.offse ...

  9. 浅析 JavaScript 中的 函数 uncurrying 反柯里化

    柯里化 柯里化又称部分求值,其含义是给函数分步传递参数,每次传递参数后部分应用参数,并返回一个更具体的函数接受剩下的参数,这中间可嵌套多层这样的接受部分参数函数,直至返回最后结果. 因此柯里化的过程是 ...

最新文章

  1. pandas dropna
  2. 安装laravel框架
  3. SQL server数据库系统部分常用的存储过程及说明
  4. Android之linux基础教学之二 总体架构
  5. 课堂练习----二维数组
  6. win8能开发android的sdk么,win8.1 64位环境搭建android开发环境
  7. python生成数据
  8. .NET Core 2.0 特性介绍和使用指南
  9. 歪批IT系列之“伪热门”人才
  10. 网上科学计算机,【图片】计算机-科普—都是从网上找的【计算机科学与技术吧】_百度贴吧...
  11. javaScript常见的五种数组去重(转载)
  12. modelica变量初始值的定义
  13. 在sagemath中运行python文件
  14. matlab fft 历程,MATLAB利用FFT分析不足一个完整周期的信号时的问题
  15. 关于HF-lpt130A与GoKit2.1(stm32)底版的链接通信(持更...)
  16. 哼唱识别(query by humming)
  17. Python—获取电脑的锁屏壁纸
  18. SAP 第四代增强-BTE
  19. php拆分excel,PHP如何切割excel大文件(附完整代码)
  20. Dwr概述与入门讲解

热门文章

  1. 自制U8简易总账工具
  2. 【总结】PHP常见面试题汇总(四)。。。
  3. 【华为机试 Python实现】HJ61 放苹果(简单)
  4. Hive 中分区是否越多越好?
  5. PYTHON将图片插入到excel
  6. linux执行du等待时间长,Linux_linux磁盘管理命令之:du命令解析,经过长时间的发展,linux磁盘 - phpStudy...
  7. A Style-Based Generator Architecture for Generative Adversarial Networks翻译
  8. android智能网络摄像头,基于Android智能后视镜摄像头共享的系统及方法与流程
  9. Windows上安装IOS虚拟机
  10. JAVA基础整理(二):数组