首頁 > web前端 > js教程 > jquery簡單實作滑鼠經過導航條改變背景圖_jquery

jquery簡單實作滑鼠經過導航條改變背景圖_jquery

WBOY
發布: 2016-05-16 17:08:38
原創
1148 人瀏覽過

複製代碼代碼如下:




UBL "-/ DTD XHTML 1.0 過渡//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


>
維護中. ..

*{
邊距:0;
填充:0;
}
正文{
文字對齊:中心;
背景:黃色;
}
#container{
寬度:962px;
高度:自動;
背景:url(b3.jpg);
邊距:0px 自動自動;
}
#head{
高度:100px;
寬度:100%;
}
.head_ul{
列表樣式:無;
左邊: 200px;
}
.head_ul li{
float:left;
寬度:90px;
高度:50px;
行高:40px;
高:50px;
行高:40px;
字體大小:20px;
頂邊距:40px;
背景:url(b1.png);
}
.head_ul li a{
text-decoration:none;
}

#main{
寬度:100%;
高度:1500px;
}
#left{
寬度:30%;
高度:100%;
浮動🎜>浮動:左;
}
#right{
寬度:70%;
高度:100%;
浮動:左;
}
#clear{
清除:兩者;
}
#foot{
高度:100px;
寬度:100%;
}

樣式>


$(function(){
$(".head_ul li").hover(function(){
$(this).css('background','url(b2.png)') ;
},function(){
$(this).css('背景','url(b1.png )');
}
);

腳本>
頭>

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板