2013-02-28 84 views
0

首先,我對引導程序非常陌生,因此請耐心等待。我一直在一個網站上有一個引導工具欄,我試圖正確工作。我見過其他的例子,但我不知道該怎麼做。單擊時更改引導程序圖標位置

在邊欄上,我在每個項目之前使用了一個<i>元素圖標,在這種情況下,這個項目是toggle icon-chevron-right。我想要做的是,當有人點擊側邊欄上的項目,顯示子項目時,圖標將更改爲icon-chevron-righttoggle icon-chevron-down

我玩過一些JavaScript,試圖讓它工作,但無濟於事。任何見解都會有所幫助。

回答

0

您可以更改的圖標,當<a>點擊類:

$('a').click(function() { 
    var icon = $(this).find('i'); 
    if (icon.hasClass('icon-chevron-down')) { 
     icon.removeClass('icon-chevron-down').addClass('icon-chevron-right'); 
    } 
    else { 
     icon.removeClass('icon-chevron-right').addClass('icon-chevron-down') 
    } 
}); 
+0

這做到了!我想這與替換課程一樣簡單。謝謝! – strudinox 2013-02-28 18:09:32

1

您可以在右側和下側箭頭中使用精靈,然後使用CSS在兩者之間切換,方法是調整背景位置。

像:

element { 
    background: url(images/whatever.png) no-repeat; 
} 

element:active { 
    background: url(images/whatever.png) no-repeat 10px 10px; 
} 

與位置發揮作用的,直到你有正確

相關問題