Раскрывающийся список начальной загрузки в фиксированной навигационной панели не реагирует на планшет - PullRequest
Новая
       15

Раскрывающийся список начальной загрузки в фиксированной навигационной панели не реагирует на планшет

0 голосов
/ 09 сентября 2018

Извините, что беспокою вас, ребята, однако старые посты (например, пункт выпадающего меню Bootstrap 4 navbar, не активируемый на мобильных устройствах ) не выполняют эту работу для меня здесь. Указанные подсказки в этом конкретном потоке уже реализованы в моем коде (см. Ниже).

Я создал фиксированную панель навигации с выпадающими меню . В настольном браузере, а также в мобильных браузерах на телефонах Android все великолепно, однако, когда дело доходит до планшета (также и Android), меню гамбургеров разворачивается, но не открывается ни одно из этих выпадающих меню. Означает: я могу щелкнуть меню гамбургера, оно открывается, но выпадающие меню остаются неактивными и не раскрываются при нажатии.

Вы можете попытаться продублировать ошибку, уменьшив размер браузера, однако это не приведет к повторному появлению ошибки (так как на настольных и мобильных устройствах все в порядке). Дополнительно: когда я использую планшет горизонтально, точка разрыва не достигается, чтобы появилось меню гамбургера. Затем, что любопытно, все в порядке, и я могу перемещаться по всем выпадающим меню. Я здесь не в курсе и хотел бы показать вам соответствующий код. 

        <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <div class="container">

            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                       <span class="sr-only">Toggle navigation</span>
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                       <span class="icon-bar"></span>
                    </button>

                <a class="navbar-brand" href="http://www.xxx.de">
                    <span class="brandicon icon-target"></span>
                    <span class="brandname">Brandname</span>
                </a>
            </div>

            <div class="collapse navbar-collapse">
                <ul class="nav navbar-nav navbar-right">
                        <li class="dropdown">
                            <a class="dropdown-toggle nav-link" href="#" role="button" id="navbarDropdown1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="btnicon icon-action-undo"></span>Früher<span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="link01.html">Antike</a></li>
                                <li><a href="link02.html">Mittelalter</a></li>
                            </ul>
                        </li>

                        <li class="dropdown">
                            <a class="dropdown-toggle nav-link" href="#" role="button" id="navbarDropdown2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="btnicon icon-frame"></span>Heute<span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="otherlink1.html">Some name</a></li>
                                <li><a href="otherlink2.html">Rechtslage</a></li>
                            </ul>
                        </li>               

                        <li class="dropdown">
                            <a class="dropdown-toggle nav-link" href="#" role="button" id="navbarDropdown3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="btnicon icon-direction"></span>Another text<span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="linkage1.html">Header1</a></li>
                                <li><a href="linkage2.html">Header2</a></li>
                            </ul>
                        </li>                                       


            </div>
        </div>
    </nav>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>

Я не для начальной загрузки и пока не имею ни малейшего намека на то, что мне здесь не хватает. Вся помощь будет принята с благодарностью. Спасибо!

1 Ответ

0 голосов
/ 11 сентября 2018

Все хорошо - и извините за беспокойство. Я на самом деле смог воспроизвести ошибку в моем настольном браузере, у меня испортился CSS. У меня была проблема с переполнением, которую я мог бы устранить, но изменил точку останова.

...