网页实战技巧--按钮背景切换

在网页默认的按钮样式不是很漂亮,有时会用图片展示。

1)很多情况下大家会用两张图片分别表示默认的按钮和鼠标悬停的按钮。再用onmousemove和onmouseout事件切换两张图片,但很多时候在切换时会出现短暂的空白效果。

2)另一种做法是把两种状态的按钮图片做在一个图片文件中,切换时只修改background-position属性,此属性可以调整背景图片的相对位置这样就可以避免出现空白。

 

但这种方法不适宜用于大块的背景切换,因为初始加载的速度会因多加载一套图片而变得很慢。

发布了43 篇原创文章 · 获赞 6 · 访问量 7万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章