js實(shí)現(xiàn)背景圖片感應(yīng)鼠標(biāo)變化的方法
本文實(shí)例講述了js實(shí)現(xiàn)背景圖片感應(yīng)鼠標(biāo)變化的方法。分享給大家供大家參考。具體分析如下:
鼠標(biāo)點(diǎn)擊后背景圖片變化,點(diǎn)擊另外一個菜單項(xiàng)前面的會自動恢復(fù)背景,其實(shí)這個如果單純使用CSS是沒辦法做的,我們還要使用JS來判斷鼠標(biāo)狀態(tài),代碼如下:
<style type="text/css"> .dh a{ background:#FFFFCC; width:50px; height:30px; display:block; text-align:center; color:#000000; } .dh a:hover{ background:#FF9900; } </style> </head> <body> <div> <div class="dh"><a href="#">導(dǎo)航1</a></div> <div class="dh"><a href="#">導(dǎo)航2</a></div> <div class="dh"><a href="#">導(dǎo)航3</a></div> <div class="dh"><a href="#">導(dǎo)航4</a></div> <div class="dh"><a href="#">導(dǎo)航5</a></div> </div> <script type="text/javascript"> $(function(){ $(".dh a").click(function(){ $(".dh a").removeAttr("style"); $(this).attr("style","background:#CCFF99;"); }) }) </script>
希望本文所述對大家的javascript程序設(shè)計(jì)有所幫助。
- picLazyLoad 實(shí)現(xiàn)圖片延時加載(包含背景圖片)
- jquery動態(tài)切換背景圖片的簡單實(shí)現(xiàn)方法
- 改變iOS應(yīng)用中UITableView的背景顏色與背景圖片的方法
- Android自定義Button并設(shè)置不同背景圖片的方法
- javascript設(shè)置頁面背景色及背景圖片的方法
- Android編程簡單實(shí)現(xiàn)ImageView點(diǎn)擊時背景圖修改的方法
- 利用jQuery和CSS將背景圖片拉伸
- android中實(shí)現(xiàn)背景圖片顏色漸變方法
- js根據(jù)鼠標(biāo)移動速度背景圖片自動旋轉(zhuǎn)的方法
- js實(shí)現(xiàn)背景圖自適應(yīng)窗口大小
相關(guān)文章
ES6基礎(chǔ)之 Promise 對象用法實(shí)例詳解
這篇文章主要介紹了ES6基礎(chǔ)之 Promise 對象用法,結(jié)合實(shí)例形式詳細(xì)分析了ES6中 Promise 對象功能、用法及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2019-08-08淺談webpack性能榨汁機(jī)(打包速度優(yōu)化)
這篇文章主要介紹了淺談webpack性能榨汁機(jī)(打包速度優(yōu)化),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2019-01-01Firefox中beforeunload事件的實(shí)現(xiàn)缺陷淺析
beforeunload 指在頁面卸載前提供的最后一次JS執(zhí)行的機(jī)會2012-05-05微信小程序開發(fā)(二)圖片上傳+服務(wù)端接收詳解
本篇文章主要介紹了微信小程序開發(fā)(二)圖片上傳+服務(wù)端接收,具有一定的參考價值,有興趣的可以了解一下。2017-01-01用headjs來管理和加載js 提高網(wǎng)站加載速度
headjs其實(shí)是一整套的工具,本文介紹的是它其中的Javascript Loader功能。需要的朋友可以參考下2016-11-11