鼠標經過時可以切換CSS嗎?如何實現?_Div+CSS教程
教程Tag:暫無Tag,歡迎添加,賺取U幣!
在頁面中我們希望用到較多的交互效果,一方面是為了視覺了需要,另一方面也體現了用戶感受。我們經常制作鼠標的交互效果,當鼠標移到某一對象上時使其產生一定的變化,以達到提醒用戶:Your Are Here!
鏈接的激活狀態,就是一種典型的交互效果,我們都知道鏈接文字或圖片等可以通過設置鏈接的Hover狀態屬性來完成設置。假如文字或圖片本身并沒有超鏈接。我們該如何編寫這樣的效果呢?鼠標經過時可以切換CSS可以實現嗎?
我們可以利用小腳本來實現這樣的效果,當然,它并不會消耗你很多的資源,不會占用你太多的空間,簡單的一句話就可以搞定了。
示例代碼 [www.wf0088.com]
onMouseOut="this.className='aaa'" onMouseOver="this.className='bbb'"
也就是設置鼠標移開和鼠標激活時,調用不同的CSS類,實現切換CSS以達到交互的效果。
我們看下面例子,下面的圖片沒有超鏈接,僅僅是插入的圖片。我們可以實現鼠標移上去改變邊框的效果。
![div css xhtml xml 代碼調試框](http://p1.mb5u.com/divcss/html.gif)
[ 可先修改部分代碼 再運行查看效果 ]
我們再看下面的例子,這是一個h1標簽,同樣也沒有超鏈接,我們可以做到當鼠標移上去時,改變背景顏色的效果。
![div css xhtml xml 代碼調試框](http://p1.mb5u.com/divcss/html.gif)
[ 可先修改部分代碼 再運行查看效果 ]
大家多動手試驗不斷的積累操作經驗,在實際操作中一定可以事半功倍.
相關Div+CSS教程:
- 相關鏈接:
- 教程說明:
Div+CSS教程-鼠標經過時可以切換CSS嗎?如何實現?
。