lang
="en"
>
>
charset
="utf-8"
/>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
/>
>
documenttitle
>
>
*html
#div1
#div2
style
>
head
>
>
"div1"
>
div>
body
>
html
>
>
let div1 = document.
queryselector
('#div1'
) div1.
addeventlistener
('click'
,(e)
=>)/*
設定相關
style
*/console.
log(
'********************瀏覽器********************'
)//瀏覽器可視區寬高
let innerwidth = window.innerwidth
let innerheight = window.innerheight
console.
log(
'瀏覽器可視區寬高:innerwidth:'
, innerwidth,
',innerheight:'
, innerheight)
console.
log(
'********************offset********************'
)//寬高+padding+border
let offsetleft = div1.offsetleft
let offsettop = div1.offsettop
console.
log(
'距離父元素左,上邊界距離'
) console.
log(
'offsetleft:'
, offsetleft,
',offsettop:'
, offsettop)
console.
log('')
//寬高+padding+border
let offsetwidth = div1.offsetwidth
let offsetheight = div1.offsetheight
console.
log(
'寬/高+padding+border'
) console.
log(
'offsetwidth:'
, offsetwidth,
',offsetheight:'
, offsetheight)
console.
log('')
console.
log(
'檢測帶有定位(absolute,relative或fixed)的父盒子節點(最近)'
) console.
log(
'offset parent:'
, div1.offsetparent)
console.
log(
'********************scroll********************'
)let scrollwidth = div1.scrollwidth
let scrollheight = div1.scrollheight
console.
log(
'寬/高+padding'
) console.
log(
'scrollwidth:'
, scrollwidth,
',scrollheight:'
, scrollheight)
console.
log('')
var scrolltop = window.pageyoffset || document.documentelement.scrolltop || document.body.scrolltop ||
0var scrollleft = window.pagexoffset || document.documentelement.scrollleft || document.body.scrollleft ||
0 console.
log(
'scroll top left:頁面被瀏覽器遮擋的頭部和左邊部分。'
) console.
log(
'scrolltop:'
, scrolltop,
',scrollleft:'
, scrollleft)
console.
log(
'********************client********************'
) console.
log(
'clientx/clienty:距離可視區左/上邊界距離 (滑鼠事件event的屬性)'
) console.
log('')
let clienttop = div1.clienttop
let clientleft = div1.clientleft
console.
log(
'元素的border'
) console.
log(
'clienttop:'
, clienttop,
',clientleft:'
, clientleft)
console.
log('')
let clientwidth = div1.clientwidth
let clientheight = div1.clientheight
console.
log(
'元素的寬/高+padding'
) console.
log(
'clientwidth:'
, clientwidth,
',clientheight:'
, clientheight)
script
>
水平垂直居中 已知寬高 未知寬高
水平 垂直居中的方法 已知寬高 未知寬高 一 居中元素 已知寬高 1 margin 根據已知的寬高寫死,不推薦 div1 div22 定位 margin top margin left.div1 div23 定位 margin.div1 div24 定位 transform 存在相容問題.div1 ...
獲取控制項高寬
一般要獲取控制項的的高寬需要控制項已經顯示或者放在onpause,ondraw等畫圖裡面 我的操作如下,也是在網上學習過來的的,希望對搭建在開發中有點幫助 int w view.measurespec.makemeasurespec 0,view.measurespec.unspecified in...
jqgrid屬性 寬,高
jqgrid屬性 width grid的寬度,如果未設定,則寬度應為所有列寬的之和 如果設定了寬度,則每列的寬度將會根據shrinktofit選項的設定,進行設定。shrinktofit 此選項用於根據width計算每列寬度的演算法。預設值為true。如果shrinktofit為true且設定了wi...