雙重引導簡單的側邊欄

Question

在我使用的來源是：http://startbootstrap.com/template-overviews/simple-sidebar/

我無法使它這樣我可以有兩種這些簡單的工具條中。我正在努力讓頁面的每一面都有一個（左邊一個，右邊一個）。現在，默認情況是側邊欄位於左側。每個側欄將由2個獨立的按鈕激活。

**注意在

< div id="wrapper" >

- 改變

< div id="wrapper" class="toggled">

Answer 1

您可以通過在HTML頁面，並在CSS其相應的樣式添加菜單添加其他側邊欄的權利。

HTML：

<!-- Right - Sidebar --> 
    <div id="sidebar-wrapper-right"> 
     <ul class="sidebar-nav"> 
      <li class="sidebar-brand"> 
       <a href="#"> 
        Right toggle 
       </a> 
      </li> 
      <li> 
       <a href="#">Dashboard</a> 
      </li> 
      <li> 
       <a href="#">Shortcuts</a> 
      </li> 
      <li> 
       <a href="#">Overview</a> 
      </li> 
      <li> 
       <a href="#">Events</a> 
      </li> 
      <li> 
       <a href="#">About</a> 
      </li> 
      <li> 
       <a href="#">Services</a> 
      </li> 
      <li> 
       <a href="#">Contact</a> 
      </li> 
     </ul> 
    </div> 
    <!-- /#sidebar-wrapper --> 

CSS：

#sidebar-wrapper-right { 
z-index: 1000; 
position: fixed; 
right: 250px; 
width: 0; 
height: 100%; 
margin-right: -250px; 
overflow-y: auto; 
background: #000; 
-webkit-transition: all 0.5s ease; 
-moz-transition: all 0.5s ease; 
-o-transition: all 0.5s ease; 
transition: all 0.5s ease; 
} 

查看工作JS提琴在這裏：DEMO

Answer 2

你需要不同的風格添加到您的側欄在一個側邊欄包裝類，就像這樣。

#sidebar-wrapper{ 
margin-left: 80%;// change this for your own properties 
left: 20% 
}