Статический Навбар - развал на маленьком устройстве - логотип должен скрываться - Bootstrap 3

Эй, у меня есть статическая навигация, которая рушится, когда размер браузера становится меньше. (Bootstrap 3 навигация)

Теперь у меня там тоже есть логотип. Я хочу, чтобы свернутая навигация прокручивалась вниз вместе с пользователем, это работает. Я использую аффикс для этого. Но я хочу спрятать логотип сейчас. Как будто логотип должен быть исправлен, пока свернутая навигация прокручивается. Единственное, что я понял - это позволить логотипу исчезнуть после прокрутки вниз на несколько пикселей. У кого-нибудь есть идея? вот код HTML:

<div id="nav">
        <div class="navbar navbar-default navbar-static" role="navigation">
            <div class="second-nav">
                <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
                <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>

                <div class="nav-logo">
                    <a href="#"><img src="images/Logo_nav.png" alt="DnD"></a>
                </div>


                <div class="navbar-collapse collapse">
                    <ul class="mainnav nav navbar-nav">
                        <li><a href="#home">Home</a></li>
                        <li><a href="#archievements">Leistungen</a></li>
                        <li><a href="#about">Über uns</a></li>
                        <li><a href="#team">Team</a></li>
                        <li class="dropdown">
                            <a href="#actuell" class="dropdown-toggle disabled" data-toggle="dropdown">Aktuelles<b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="#actuellall">Alle Artikel</a></li>
                            </ul>
                        </li>
                        <li><a href="#customers">Kunden</a></li>
                        <li class="dropdown">
                            <a href="#jobs" class="dropdown-toggle disabled" data-toggle="dropdown">Jobs<b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><a href="#jobsall">Alle Jobs</a></li>
                            </ul>
                        </li>
                        <li><a href="#contact">Kontakt</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

0 ответов

Другие вопросы по тегам