JS——事件詳情（鼠標事件：clientX、clientY的用法）

鼠標位置

》可視區位置：clientX、clientY

跟着鼠標移動的div案例

代碼以下圖：

 

這個案例，運用到前一篇文章中的event事件來處理。獲取div的left和top值，當鼠標移動時，div的left和top值跟着鼠標位置改變而改變。（注意的是：須要給div設置絕對定位）

演示效果以下圖：

 

可是！！！

當我給body設置高度時，改變body的高度，這個案例效果就發生變化了，變得很詭異。

代碼以下圖：

效果圖顯示以下：

爲何給body設置了一個2000px的高度後，這個案例就變得如此詭異呢？？？

原來，clientX和clientY解釋爲：鼠標的可視區座標！！！！

 

看下面這張圖，來簡單解釋一下：

修改代碼，完成完整的案例。代碼以下圖：

其中的scrollTop能夠參考本人的前面文章，裏面有講解scrollTop的語法和用法等　　

【跳轉自：http://www.javashuo.com/article/p-yjfibzqy-co.html中的（5）document.documentElement.scrollTop(獲取滾動條位置)】