如何在Bootstrap 3.2中單擊它來更改圖形？

我想要一個箭頭指向右側以允許用戶展開邊欄，然後將該圖形更改爲指向左側。這樣，它指向左側，以便他們瞭解如何隱藏邊欄。然後我希望它變回默認狀態。如何在Bootstrap 3.2中單擊它來更改圖形？

這是我目前：

 <div id="page-content-wrapper"> 
     <div class='hidden-lg'> 
     <div class="content-header"> 
       <h1> 
       <a id="menu-toggle" href="#" class="btn btn-default"><i class="glyphicon glyphicon-arrow-right"></i></a> 
       </h1> 
     </div> 
     </div>

來源

2014-07-23 rb612

變化glyphicon類上點擊。 – sevenseacat

當談到JS和JQuery時，我是一個noob。你是對的，這正是我必須做的，但我不知道如何編碼。 – rb612

http://learn.jquery.com/ –

只需使用：

$('#menu-toggle').click(function(){ 
    $(this).find('i').toggleClass('glyphicon-arrow-right').toggleClass('glyphicon-arrow-left'); 
});

Fiddle Example

來源

2014-07-23 04:25:28 apsdehal

Apsdehal，非常感謝你的回答。我在使用這段代碼時遇到了麻煩，因爲圖形點擊後會消失。 – rb612

立即編輯檢查。 – apsdehal

嘗試

$('#menu-toggle').on('click', function(){ 
    var iSelector = $(this).find('i:first'); 
    if(iSelector.hasClass('glyphicon-arrow-right')) { 
     iSelector.removeClass('glyphicon-arrow-right') 
     iSelector.addClass('glyphicon-arrow-left') 
    } 
});

Fiddle

參考：

來源

2014-07-23 04:24:12 Okky

如何在Bootstrap 3.2中單擊它來更改圖形？

回答

相關問題