我需要一個jquery手風琴，爲每個部分的箭頭圖標使用不同的圖像文件

這是一個類似的問題，前面已經問過一兩個問題，我需要手風琴做些稍微不同的事情。當手風琴處於不活動狀態時，所有圖標都是相同的，我只需要在懸停或活動狀態下單獨更換圖標。我需要一個jquery手風琴，爲每個部分的箭頭圖標使用不同的圖像文件

<div id="accordion"> 
<h3 class="acch1"><a class="acc1" href="#">Management and Analysis</a></h3> 
<div> 
</div> 
<h3><a class="acc2" href="#">Communication Management</a></h3> 
<div> 
</div>

的CSS：

.ui-icon { width: 21px; height: 21px; background-image: url(../images/ui-icons_454545_256x240.png); } 
.ui-widget-content .ui-icon {background-image: url(../images/ui-icons_454545_256x240.png); } 
.ui-widget-header .ui-icon {background-image: url(../images/ui-icons_454545_256x240.png); } 
.ui-state-default .ui-icon { background-image: url(../images/ui-icons_454545_256x240.png); } 
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(../images/ui-icons_454545_256x240.png); } 
.ui-state-active .ui-icon {background-image: url(../images/ui-icons_454545_256x240.png); } 

.ui-accordion-header.acch1 .ui-state-hover .ui-icon {background-image: url(../images/ui-icons_669FC5_256x240.png); } 
.ui-accordion-header.acch1 .ui-state-active .ui-icon {background-image: url(../images/ui-icons_669FC5_256x240.png); }

底部的兩個是什麼，我嘗試使用，而他們的工作，直到我在的.ui狀態懸停和的.ui態活性增加。

這裏的的jsfiddle jsfiddle

來源

2012-05-03 MWhitmore

當您使用jsfiddle時，它使生活變得更加簡單，並使查找IMO解決方案的速度更快。 –

你打開3個div，但只關閉2個？這是一個錯字嗎？ –

總共有5個div，有大量的內容，實際上只有h3與這個問題有關。 – MWhitmore

我相信如果你從你的規則中刪除ACCH1類，並更改的定位，那麼它應該工作。試着用你的圖片下面：

h3.ui-accordion-header.ui-state-hover span.ui-icon {background-image: url(http://code.jquery.com/ui/1.8.20/themes/base/images/ui-icons_222222_256x240.png); } 
h3.ui-accordion-header.ui-state-active span.ui-icon {background-image: url(http://code.jquery.com/ui/1.8.20/themes/base/images/ui-icons_222222_256x240.png); }

通過保持.acch1類作爲規則的一部分，你會只針對特定H3元素而不是任何活動或懸停的元素。

來源

2012-05-03 15:42:11 j08691

這會工作，但我需要每個人都有不同的圖像文件（不同的顏色） – MWhitmore

好吧，那麼你只需複製規則，追加每個H3元素的類或ID。 – j08691

如果它只是默認的 ''.ui-state-hover .ui-icon，.ui-state-focus .ui-icon {background-image：url（../ images/ui-icons_454545_256x240.png ）; }' – MWhitmore

我需要一個jquery手風琴，爲每個部分的箭頭圖標使用不同的圖像文件

回答

相關問題