本文內容承接Javascript特效開發（三）

第六章? ? Javascript特效開發第五階段

6.1元素的位置和尺寸操作

獲得元素位置

獲得元素尺寸

6.2滾動條位置操作

scollTop，是指滾動上去的部分的的高度。

整個滾動元素寬高則是scollHeight，scollWidth

獲取具有滾動條元素的屬性

（1）事例一

簡單的滾動條元素的屬性獲取和設置

運行結果

（2）事例二：（定時器+滾動條實現自動閱讀效果）

自動閱讀效果

運行結果，點擊開始自動滾動，點擊停止停止滾動

除此之外還可以實現網頁內漂浮廣告效果，詳情見文章《漂浮廣告效果》。

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

6.3事件對象

什么是事件對象

事件對象只有在事件發生的時候才產生，是個局部變量，只有在事件處理程序中被調用，事件結束時這個變量也會被銷毀。

如何獲取事件對象

關于鼠標事件

事例

6.4 鍵盤事件對象

window.onkeydown = function(){e};鍵盤按下事件

window.onkeyup = function(){e};鍵盤抬起事件

window.onkeypress = function(){e};安下并松開任意的數字或字母鍵

鍵盤事件對象的屬性

?鍵盤事件事例

利用鍵盤事件可以實現打字游戲等功能。

6.5事件流 阻止元素默認事件

事件流

阻止事件流

效果：

效果圖

若不阻止事件流，點擊藍翔所在div會依次alert ?藍翔--->山東--->中國; 加入阻止事件流后，點擊只alert 藍翔。

實現代碼：

阻止事件流

阻止瀏覽器默認行為，一般用于a標簽和form表單。常用方法是利用重定向，'javaxcript:viod(0)'。

阻止瀏覽器默認行為 方法一

阻止瀏覽器默認行為 方法二

6.6日期對象

在Javascript中日期也是內置對象，所以我們要對日期進行獲取或操作，必須實例化對象。

獲取日期信息的方法

創建日期對象

日期設置

可使用日期對象實現倒計時效果。

思路：1、結束事件、當前時間；2、兩個時間轉化成毫秒的差；3、毫秒差中有多少個整年整月整日整的時分秒；4、定時器控制

《Javascript特效開發（一）》、《Javascript特效開發（二）》、《Javascript特效開發（三）》以及《Javascript特效開發（四）》對Javacript的ECMAscript部分、DOM和BOM部分進行基礎知識講解。后續更多精彩內容敬請期待吧~

如有問題歡迎交流。

如轉載請注明出處，謝謝！