網頁實戰技巧--按鈕背景切換

在網頁默認的按鈕樣式不是很漂亮,有時會用圖片展示。

1)很多情況下大家會用兩張圖片分別表示默認的按鈕和鼠標懸停的按鈕。再用onmousemove和onmouseout事件切換兩張圖片,但很多時候在切換時會出現短暫的空白效果。

2)另一種做法是把兩種狀態的按鈕圖片做在一個圖片文件中,切換時只修改background-position屬性,此屬性可以調整背景圖片的相對位置這樣就可以避免出現空白。

 

但這種方法不適宜用於大塊的背景切換,因爲初始加載的速度會因多加載一套圖片而變得很慢。

發佈了43 篇原創文章 · 獲贊 6 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章