Bootstrap Off Canvas menu под панелью навигации

Question

Пожалуйста, простите меня, если вы чувствуете, что вопрос, который я задаю, немного глупо.

Я пытаюсь создать HTML-страницу с Bootstrap NavBar и Off Canvas и нашел страницу, которая делает то же самое, что я хотел. В дополнение к существующей мне нужна одна дополнительная функция.

http://getbootstrap.com/examples/offcanvas/

Если вы посмотрите на эту ссылку, вы увидите панель навигации в верхней части страницы и списка на правой стороне hadn. когда мы уменьшаем размер панели навигации страницы, она превратится в значок меню, и список исчезнет. Кроме того, новая кнопка будет добавлена, чтобы показать список скрыть (см. Ниже Большого экрана изображения)

Что мне нужно, чтобы переместить кнопку/ссылки, которая видна на небольшом экране должны добавляются на левой стороне навигационная панель. Simmiler вид иконы один мы имеем в меню на маленьком экране (см. Ниже маленького экрана изображения)

Большого экран

Малого экран

Answer 1

Вы можете поместить кнопку переключения в навигационной панели, как это ..

<div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <button type="button" class="navbar-toggle visible-xs pull-left" data-toggle="offcanvas"> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="#">Project name</a> 
     </div> 

Codeply demo

Answer 2

Попробуйте использовать класс pull-left на кнопке вместо класса pull-right по умолчанию.

Пример: http://www.bootply.com/274FaWMbMX

Недостаток этой конструкции является то, что после того, как пользователь нажимает на кнопку, чтобы получить доступ к меню, кнопка больше не видна из-за меню расширяется.