第51天 封裝可視區域大小函式client

offsetwidth:width  +  padding  +  border（披著羊皮的狼）  

clientwidth：width  +  padding      

不包含border

scrollwidth:大小是內容的大小

二、檢測螢幕寬度(可視區域

)

1、ie9及其以上的版本

window.innerwidth

2、標準模式

document.documentelement.clientwidth

3、怪異模式

document.body.clientwidth

window.onscroll  = function() {}  螢幕滾動事件

window.onresize= function() {}  視窗改變事件

onresize 事件會在視窗或框架被調整大小時發生

四、函式

function fun()         

fun   是函式體的意思   

fun()  呼叫函式 的意思  

function fun()

console.log(fun);  // 返回函式體 function fun()

console.log(fun()); // 呼叫函式  3  返回的是結果

fun();

window.onresize = 3

window.onresize = function fun()

clientwidth返回的是 可視區 大小    瀏覽器內部的大小

window.screen.width返回的是我們電腦的 解析度   跟瀏覽器沒有關係

六、封裝可視區域大小的函式

1

doctype html
>
2<
html 
lang
="en"
>
3<
head
>
4<
meta 
charset
="utf-8"
>
5<
title
>封裝可視區域大小的函式
title
>
6head
>
7<
body
>89
body
>
10html
>
11<
script
>
12function

client()18}
else
if(document.compatmode
==="css1compat")23
24}25return29}
30
document.write(client().width);
31script
>

元素可視區client系列

client翻譯過來就是客戶端，我們使用client系列的相關屬性來獲取元素可視區的相關資訊。通過client系列的相關屬性可以動態的得到該元素的邊框大小 元素大小等。client系列屬性 作用element.clienttop 返回元素上邊框的大小 element.clientleft 返回元素左...

相容的可視區高度和寬度

function viewwidth function viewheight document.body.clientwidth body物件寬度 document.body.clientheight body物件高度 document.documentelement.clientwidth 可見區...

視窗可視區和其他一些引數

可視區只是內容呈現的區域，不包括邊框，滾動條等。clientheight 可視區的高度 clientwidth 可視區的寬度 scrolltop 滾動距離 即滾動條滾動過的距離，如圖表示 獲取可視區高度和寬度的語句 document.documentelement clientwidth 獲取可視區...