1. 程式人生 > >scrollWidth、clientWidth、offsetWidth 區別

scrollWidth、clientWidth、offsetWidth 區別

一、屬性說明:
  1. clientWidth = width(可見區域)+ padding - 滾動條寬度
  2. offsetWidth = width(可見區域) + padding + border(若有滾動條寬,那就包含在裡面了)
  3. scrollWidth = width(自身實際長度,包括不可見區) + padding + border + margin

二、圖例:




相關推薦

scrollWidthclientWidthoffsetWidth 區別

一、屬性說明:clientWidth = width(可見區域)+ padding - 滾動條寬度offsetWidth = width(可見區域) + padding + border(若有滾動條寬,

scrollWidthclientWidthoffsetWidthwidth的區別

字符 adding com 樣式表 src 屬性 分享圖片 ext window scrollWidth:對象的實際內容的寬度,不包邊線寬度,會隨對象中內容超過可視區後而變大。 clientWidth:對象內容的可視區的寬度,不包滾動條等邊線,會隨對象顯示大小的變化而

javascript中offsetWidthclientWidthwidthscrollWidthclientXscreenXoffsetXpageX

nth 相同 位置 註意 讀寫 watermark pagex pan navi offsetWidth //返回元素的寬度(包括元素寬度、內邊距和邊框,不包括外邊距) offsetHeight //返回元素的高度(包括元素高度、內邊距和邊框,不包括外

對html標籤的offsetWidthclientWidthscrollWidth屬性的理解

如果是用jquery 操作 請用 $(".box")[0].clientHeight; 或$("#box")[0].offsetWidth            $(".box") 是選中 class 為box  的jquery物件    $(".box")[0] 是選中 c

理解clientXclientYoffsetLeftevent.offsetTopoffsetWidthoffsetHeightclientWidthclientHeightscrollTopscrollHeight

event get 頁面 off 偏移 技術 clientx 滾動 padding 一、clientX和clientY   事件發生時,鼠標距離瀏覽器的可視區域的X、Y軸的位置,不包含滾動條的區域的部分。就算是頁面進行了滾動,鼠標的坐標值還是參考可視區域的。 二、offse

獲取屏幕寬高度與可視區域寬高度(availWidthclientWidthwidthinnerWidth)

標簽欄 獲取 包含 cli 頂部 bsp ima img nbsp   經常會遇到需要獲取屏幕寬度、高度,可視區域寬度、高度等問題,也就常跟這幾個打交道,一不小心,還真愛弄混淆了。   先來列舉下這幾個吧:   screen.availHeight、screen.ava

JS中的位置和寬度:clientWidthoffsetWidthscrollWidth區別

   首先定義一個div。 然後稍微裝修一下 下面開始區分     一、clientWidth和clientHeigh 、 clientTop和clientLeft       &n

JS中關於clientWidthoffsetWidthscrollWidth 的含義

doc offset tran doctype width 指定 html 5.5 ava 網頁可見區域寬: document.body.clientWidth;網頁可見區域高: document.body.clientHeight;網頁可見區域寬: document.bo

JS 獲取瀏覽器視窗大小clientWidthoffsetWidthscrollWidth

常用: JS 獲取瀏覽器視窗大小 // 獲取視窗寬度 if (window.innerWidth) winWidth = window.innerWidth; else if ((document.body) && (document.body.clientWidth)) w

JS:body元素物件的clientWidthoffsetWidthscrollWidthclientLeftoffsetLeftscrollLeft

document.body.clientWidth 獲取body元素物件的內容可視區域的寬度,即clientWidth=width+padding,不包括滾動條。 document.body.clientHeight 獲取body元素物件的內容可視區域的高度,即clientHeight=height+padd

JS:document.documentElement物件的clientWidthoffsetWidthscrollWidthclientLeftoffsetLeftscrollLeft

document.documentElement.clientWidth 獲取瀏覽器視窗文件顯示區域的寬度,不包括滾動條。 document.documentElement.clientHeight 獲取瀏覽器視窗文件顯示區域的高度,不包括滾動條。 瀏覽器相容性 所有瀏覽器解釋都一樣。 document.d

document.documentElement物件的clientWidthoffsetWidthscrollWidthclientLeftoffsetLeftscrollLeft

轉載自 @鬼眼邪神document.documentElement.clientWidth獲取瀏覽器視窗文件顯示區域的寬度,不包括滾動條。document.documentElement.clientHeight獲取瀏覽器視窗文件顯示區域的高度,不包括滾動條。瀏覽器相容性所有

clientWidthoffsetWidth等介紹

網頁可見區域寬:document.body.clientWidth 網頁可見區域高:document.body.clientHeight 網頁可見區域寬:document.body.offsetWidth (包括邊線的寬) 網頁可見區域高:document.body.offsetHeight (包括

malloccallocrealloc和alloca各種的區別

calloc 一次 單元 不支持 new span 初始化 har 堆棧 需要先包含頭文件 #include"malloc.h" malloc是標準的在堆中開辟新的空間 比如 char *pt=(char *)malloc(10*sizeof(char)); 需要free(

getContextPathgetServletPathgetRequestURI的區別

request 執行 result web print 名稱 ati 輸入 pri 假定你的web application名稱為example,你在瀏覽器中輸入請求路徑: https://localhost:8080/example/main/edit.jsp 則執行

(轉載)display:inlineblockinline-block的區別

order label doc class 先後 padding str 如何實現 col display:block就是將元素顯示為塊級元素.   block元素的特點是:  總是在新行上開始;  高度,行高以及頂和底邊距都可控制;  寬度缺省是它的容器的100

call() apply() bind()方法的作用和區別

調用 權威指南 () 使用 func 開始 把他 對象 bsp 從一開始,我是在書上看到關於bind()、call() 和 apply(), 不過長久以來,在工作中與網上接觸到了很多關於這三個方法的使用場景,對這三個方法也算是比較熟悉了。所以把他們的作用和區別簡單闡述一下!

JS中constvar和let區別

方法 pre 命令 con 使用 它的 comm 作用 影響 在JavaScript中有三種聲明變量的方式:var、let、const。 1.const 聲明創建一個只讀的常量。這不意味著常量指向的值不可變,而是變量標識符的值只能賦值一次,必須初始化。 const b

jQuery 的 width()height()innerWidth()innerHeight()outWidth()outHeight() 的區別

order head ges alt mar inner 顯示 round out jQuery width() 和 height() 方法 width() 方法設置或返回元素的寬度(不包括內邊距、邊框或外邊距)。 height() 方法設置或返回元素的高度(不包括內邊距、

WCFWebAPIWCFRESTWebService之間的區別

pipes asmx 平板電腦 bind template windows服務 創建 通過 soa 在.net平臺下,有大量的技術讓你創建一個HTTP服務,像Web Service,WCF,現在又出了Web API。在.net平臺下,你有很多的選擇來構建一個HTTP Ser