Bootstrap 3: Mobile nav открывается на рабочем столе, но не на iPhone?

Я создал сайт для пары друзей, и я приближался к финишу его:Bootstrap 3: Mobile nav открывается на рабочем столе, но не на iPhone?

http://hopetherapy.info

Задача: Когда я нажимаю на меню мобильного нав гамбургеров, она открывается на рабочем столе (сделать окно тощий для тестирования) в FireFox, Safari, Chrome на Mac до сих пор. На iPhone 6 OS 10.1.1, однако, выбор меню гамбургера не приводит к действию (еще не протестирован на Android).

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

Результирующий HTML меню:

<header id="nav"> 
    <div class="navbar navbar-inverse navbar-fixed-top" data-spy="affix" data-offset-top="10"> 
    <div class="container"> 

     <a href="#" class="navbar-brand"><img alt="Hope Heals Counseling" src="/wp-content/themes/bootstrap-hope-heals/img/hope-heals-counseling2.png"></a> 

     <a class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </a> 

     <div class="navbar-collapse collapse"> 
     <ul id="menu-main-menu" class="nav pull-right navbar-nav"><li id="menu-item-27" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-6 current_page_item menu-item-27 active active"><a href="http://hopetherapy.info/">Home</a></li> 
      <li id="menu-item-25" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25"><a href="http://hopetherapy.info/answers/">Answers</a></li> 
      <li id="menu-item-24" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-24"><a href="http://hopetherapy.info/blog/">Blog</a></li> 
      <li id="menu-item-23" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-23"><a href="http://hopetherapy.info/contact/">Contact</a></li> 
      <li id="menu-item-28" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-28"><a href="tel:16164227787">Call: +1.616.422.7787</a></li> 
     </ul> 
     </div> 

    </div> 
    </div> 
</header>

Любые мысли о том, что может быть причиной меню гамбургер не открывать на iPhone?

источник

2016-11-12 Christopher Stevens

Не могли бы вы разместить свои метатеги? – Falk

Конечно. Вот полная ссылка для шаблона: http://christopherstevens.cc/hopeheals/web2d/ Оказывается, мой оригинальный шаблон дизайна до слияния с WordPress имеет ту же проблему. Связанный простой код может помочь быстрее устранить неполадки. –

Hm, метатег viewport есть. Ваш сайт также отлично работает на Android Note 6. Недавно я узнал об ошибке, которую iPhone 5 имел в некоторых обстоятельствах: когда была непрозрачность, примененная к чему-то, она не появлялась. Я не знаю, может ли это быть причиной. Что происходит вместо этого? Остается ли обычный экран на экране? – Falk

-1

похоже, что есть ошибка консоли, которая может повлиять на javascript. это код, который генерирует ошибку:

jQuery(document).ready(function() { 

    //scroll to next section on home page 
    $("#goscroll").click(function(e) { 
    var offset = 50; 
    e.preventDefault(); 
    var dest = $("#services"); 

     $('html,body').animate({ scrollTop: window.innerHeight - offset }, 2500); 
     }); 

});

Ошибка говорит о том, что $ не определено. определить $ Изменить эту строку

jQuery(document).ready(function()

Для этого:

jQuery(document).ready(function($)

Это должно исправить эту ошибку, то проверить и посмотреть, если нав работает после этого.

источник

2016-11-12 16:35:23 MikeL5799

Позвольте мне проверить это (и я не сделал -1, спасибо за комментарий) –

Я опробовал ваше решение, которое можно протестировать на http://www.christopherstevens.cc/hopeheals/web2d2, без кубиков время. –

Кто-то уже ответил на этот вопрос для меня, обнаруженный после нового поиска. Мне не хватало href = "#" в меню гамбургера. Full details here.

источник

2016-12-03 17:51:08

Bootstrap 3: Mobile nav открывается на рабочем столе, но не на iPhone?

ответ

Смежные вопросы