jQuery手風(fēng)琴效果，鼠標(biāo)移動(dòng)的時(shí)候右側(cè)總有一塊背景色閃動(dòng)，實(shí)在不知道哪里出了問題，哪位大神幫我看看

回答的有點(diǎn)晚了

網(wǎng)站建設(shè)哪家好，找創(chuàng)新互聯(lián)公司！專注于網(wǎng)頁設(shè)計(jì)、網(wǎng)站建設(shè)、微信開發(fā)、微信小程序開發(fā)、集團(tuán)企業(yè)網(wǎng)站建設(shè)等服務(wù)項(xiàng)目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了道外免費(fèi)建站歡迎大家使用！

這個(gè)其實(shí)比較容易解決 你把ul的寬度寫的比盛放圖片的盒子寫的稍微大一點(diǎn)（自己把握）

然后再設(shè)置一下屬性“over-flow”為“hidden”就能解決了

屬性設(shè)置

問題解決

高分求jquery 手風(fēng)琴效果實(shí)現(xiàn)代碼

style

*,body,ul,li,a,h2{ margin:0; padding:0; list-style:none;}

body{font:12px "宋體"; padding-top:20px;}

#menu { width:211px; height:100%; float:left; margin-left:22px; margin-left:11px; margin-top:10px; margin-bottom:10px; _padding-bottom:10px; overflow:hidden;}

#menu a { cursor:pointer; width:211px; height:31px; float:left; padding-left:50px; background:url(../App_Themes/images/itemBg.jpg) no-repeat left top; color: #000000; cursor: pointer; font-weight:normal; font-size: 12px; line-height:31px; margin-top:2px; position:relative;}

#menu a:hover { cursor:pointer; width:211px; height:31px; float:left; padding-left:50px; background:url(../App_Themes/images/typeBg.jpg) no-repeat left top; color: #ffffff; cursor: pointer; font-weight:normal; font-size: 12px; line-height:31px; margin-top:2px; position:relative;}

#menu h2 { cursor:pointer; width:211px; height:31px; float:left; padding-left:50px; background:url(../App_Themes/images/type_sec.jpg) no-repeat left top; color: #db5901; cursor: pointer; font-weight:normal; font-size: 12px; line-height:31px; margin-top:2px; position:relative;}

#menu h2:hover { cursor:pointer; width:211px; height:31px; float:left; padding-left:50px; color: #333333; cursor: pointer; font-weight:normal; font-size: 12px; line-height:31px; margin-top:2px; position:relative;}

#menu a.navhov { cursor:pointer; width:211px; height:31px; float:left; padding-left:50px; background:url(../App_Themes/images/typeBg.jpg) no-repeat left top; color: #ffffff; cursor: pointer; font-weight:normal; font-size: 12px; line-height:31px; margin-top:2px; position:relative;}

.no { display:none;}

.type_prod_title{width:234px; height:26px; background-color:#4c4c4c; text-align:center; font-size:12px; color:White; line-height:26px; font-weight:normal; float:left; overflow:hidden;}

/style

div class="type_prod_con"

div class="type_prod_title"

產(chǎn)品專區(qū)/div

div id="menu"

a onclick="javascript:ShowMenu(this,'NO0')"實(shí)木地板系列/a

span id="NO0" class="no"

h2 onclick="javascript:ShowMenu(this,'NO00')"

實(shí)木地板名稱/h2

h2 onclick="javascript:ShowMenu(this,'NO01')"

實(shí)木地板名稱/h2

h2 onclick="javascript:ShowMenu(this,'NO02')"

實(shí)木地板名稱/h2

h2 onclick="javascript:ShowMenu(this,'NO03')"

實(shí)木地板名稱/h2

/span

a onclick="javascript:ShowMenu(this,'NO1')"實(shí)木門系列/a span id="NO1" class="no"

h2 onclick="javascript:ShowMenu(this,'NO10')"

實(shí)木門名稱/h2

h2 onclick="javascript:ShowMenu(this,'NO11')"

實(shí)木門名稱/h2

/spana onclick="javascript:ShowMenu(this,'NO2')"板式家具系列/a span id="NO2" class="no"

h2 onclick="javascript:ShowMenu(this,'NO20')"

三級(jí)菜單C_1/h2

h2 onclick="javascript:ShowMenu(this,'NO21')"

三級(jí)菜單C_2/h2

/spana onclick="javascript:ShowMenu(this,'NO3')"軟床系列/a span id="NO3" class="no"

h2 onclick="javascript:ShowMenu(this,'NO30')"

四級(jí)菜單D_1/h2

h2 onclick="javascript:ShowMenu(this,'NO31')"

四級(jí)菜單D_2/h2

/spana onclick="javascript:ShowMenu(this,'NO4')"沙發(fā)系列/a span id="Span1" class="no"

h2 onclick="javascript:ShowMenu(this,'NO40')"

四級(jí)菜單D_1/h2

h2 onclick="javascript:ShowMenu(this,'NO41')"

四級(jí)菜單D_2/h2

/spana onclick="javascript:ShowMenu(this,'NO5')"飾品系列/a span id="Span2" class="no"

h2 onclick="javascript:ShowMenu(this,'NO50')"

四級(jí)菜單D_1/h2

h2 onclick="javascript:ShowMenu(this,'NO351')"

四級(jí)菜單D_2/h2

/span

/div

/div

script language="JavaScript"

!--//

function ShowMenu(obj,noid){

var block = document.getElementById(noid);

var n = noid.substr(noid.length-1);

if(noid.length==4){

var ul = document.getElementById(noid.substring(0,3)).getElementsByTagName("ul");

var h2 = document.getElementById(noid.substring(0,3)).getElementsByTagName("h2");

for(var i=0; ih2.length;i++){

//h2[i].innerHTML = h2[i].innerHTML.replace("+","-");

h2[i].style.color = "";

}

obj.style.color = "#db5901";

for(var i=0; iul.length; i++){if(i!=n){ul[i].className = "no";}}

}else{

var span = document.getElementById("menu").getElementsByTagName("span");

var h1 = document.getElementById("menu").getElementsByTagName("h1");

for(var i=0; ih1.length;i++){

h2[i].innerHTML = h1[i].innerHTML.replace("+","-");

h2[i].style.color = "";

}

obj.style.color = "#ffffff";

for(var i=0; ispan.length; i++){if(i!=n){span[i].className = "no";}}

}

if(block.className == "no"){

block.className = "";

obj.innerHTML = obj.innerHTML.replace("-","+");

}else{

block.className = "no";

obj.style.color = "";

}

}

//--

/script

jquery的手風(fēng)琴特效

$(function(){

$(".theatre-item").mouseover(function(){

$(this).addClass('aa');

$(this).siblings().addClass('aa');??//this的兄弟節(jié)點(diǎn)添加類aa

$(this).next().removeClass('aa')????//this的下一個(gè)節(jié)點(diǎn)去除類aa

});

$(".theatre-item").mouseout(function(){

$(this).removeClass('aa');

});

});

怎么使jquery手風(fēng)琴全部折疊

如果你用的是jquery-ui-accordion的話，可以用這種方法$( ".selector" ).accordion({ active: -1 });你可以試試。

網(wǎng)站欄目：jquery手風(fēng)琴效果,jq手風(fēng)琴的幾種寫法
文章鏈接：http://chinadenli.net/article45/dsiddei.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)網(wǎng)站建設(shè)、網(wǎng)站營銷、建站公司、微信公眾號(hào)、微信小程序、定制網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)