js中的動畫效果

2021-07-22 12:06:59 字數 1000 閱讀 1826

clientwidth:獲取物件的內容可視區域的寬度,即clientwidth=width+padding,不包括滾動條。

clientheight:獲取物件的內容可視區域的高度,即clientheight=height+padding,不包括滾動條。

scrollwidth:獲取物件內容的實際寬度,即物件的滾動寬度。

scrollheight:獲取物件內容的實際高度,即物件的滾動高度。

offsetwidth:獲取物件的寬度,即offsetwidth=width+padding+scrollbar(滾動條)+border。也可以寫成offsetwidth=clientwidth+scrollbar(滾動條)+border。

offsetheight:獲取物件的寬度,即offsetheight=height+padding+scrollbar(滾動條)+border。也可以寫成offsetheight=clientheight+scrollbar(滾動條)+border。

clienttop:獲取物件的上邊框的寬度。

clientleft:獲取物件的左邊框的寬度。

scrolltop:設定或獲取物件最頂端和物件內容的最頂端之間的距離。

scrollleft:設定或獲取物件最左端和物件內容的最左端之間的距離。

offsettop:獲取物件相對於版面或由offsetparent屬性指定的父座標的頂部位置。

offsetleft:獲取物件相對於版面或由offsetparent屬性指定的父座標的左側位置。

offsetparent:指的是最近的定位祖先元素。如果沒有祖先元素是定位的話,會指向body元素。

td的offsetparent是table,不管table是否有定位屬性。td裡面的元素的offsetparent為第乙個定位的parents元素,如果沒有定位元素呢,分為三種:

如果該元素沒有定位時:td

如果該元素有定位,table都沒有定位的話,ie6中=html,ff,ie8=body

如果該元素和table都定位的話:table

js的動畫效果(框架)

在製作靜態頁面中,少不了要學習一些動態的效果。例如的跳躍 滑鼠移入移出 圖表的變化的一些效果等等許多。如果頁面中有許多的效果,每做乙個效果都想乙個流程的話會很麻煩,所以,將動畫效果的框架做乙個整理就是很有必要的了。今天就是將一些動畫框架做乙個整理,方便使用。運動中,無非改變的是width left ...

《js動畫效果》之多物體動畫

學習資源來自慕課網 js動畫效果 多物體運動 給多個元素加上同一動畫效果,比如下面兩個例子 1.網頁上有一ul,ul中有三個li元素,要求滑鼠移到 onmouseover li 元素上產生動畫效果 寬度值增加到300px,滑鼠移出 onmouseout li 元素產生動畫效果 寬度值復原到200px...

js動畫效果之緩衝動畫

此案例基於之前的案例,上兩個例子兩個物體所做的都是勻速運動,就像火車進站一樣,如果在快到達目的地時速度慢下來,視覺效果會更好,就之前的 稍微改革速度就好了 下面是效果圖對比 由於上傳的是.gif格式的,可能效果看起來不是很明顯,可以自己試下 js 實現改動部分 其他與之前相同 var speed m...