CSS配合JavaScript做酷的動態頁面效果

2024-07-11 08:43:29

字體：大中小

來源：轉載

供稿：網友

　　利用CSS配合JavaScript的可以做很多更酷的動態頁面效果，在本教程的最后給大家簡單介紹一下CSS配合JS的應用。首先，要搞清楚事件和動作的概念。在客戶端腳本中，JavaScript 通過對事件進行響應來獲得與用戶的交互。例如，當用戶單擊一個按鈕或者在某段文字上移動鼠標時，就觸發了一個單擊事件或鼠標移動事件，通過對這些事件的響應，可以完成特定的功能(例如，單擊按鈕彈出對話框，鼠標移動到文本上后文本變色等)。
　　下面介紹幾種常見的事件：
　　onClick：鼠標單擊事件。(是指鼠標按下，然后松開時產生。)
　　onDblClick：鼠標雙擊事件。(是指鼠標快速按下，松開，并再次按下時產生。)
　　onMouseDown：鼠標按下事件。(鼠標按下時即產生。)
　　onMouseUp：鼠標釋放事件。(是指鼠標從按下的狀態到彈起。)
　　onMouseMove：鼠標移動事件。(是指在特定元素上移動鼠標。)
　　onMouseOver：鼠標經過事件。(是指，當指針從外界往元素上移動時產生。)
　　onMouseOut：鼠標離開事件。(是指鼠標從特定元素上離開時產生。)
　　onLoad：載入事件。(當圖象或頁面結束載入時產生。)
　　onUnload：卸載事件。(當訪問者離開頁面時產生。)
　　onScroll：滾動條滾動事件。(當訪問者使用卷軸上移或下移時產生。)
　　有了事件以后，我們就為事件加上動作。這里只說改變當前元素自定義樣式的動作，我們可以用這個方法先設定好兩個自定義的CSS樣式，對象原先調用第一種樣式，當產生鼠標事件時讓對象應用到第二種CSS樣式，而產生的鼠標效果。

上一篇：WEB標準,Web前端工程師定位淺談

下一篇：WEB標準,Web前端開發工程師必備技術列表