Mam dwie navbary na mojej stronie, jedną w nagłówku i drugą w stopce

Część nagłówka działa poprawnie, ale chcę, aby stopka była podobna do paska nawigacyjnego, ale gdy idę w widoku mobilnym (mniejsza rzutnia) pojawia się przycisk przełączania (domyślna funkcja bootstrap), ale po kliknięciu tego przełącznika przesuwa się w dół , a zawartość jest wyświetlana pod paskiem nawigacyjnym, w górę, więc czy ktoś może mi w tym pomóc?

Nie wiem, jak włączyć Bootstrap w Fiddle, więc bezpośrednio publikuję mój kod stopki. zawiera pliki rozruchowe i pliki Fontawesome bezpośrednio w moim.

DostałBootply połączyć:http://bootply.com/104001

<footer>
    <div class="navbar navbar-inverse navbar-fixed-bottom">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#footer-body">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <ul class="footer-bar-btns visible-xs">
                    <li><a href="#" class="btn" title="History"><i class="fa fa-2x fa-clock-o blue-text"></i></a></li>
                    <li><a href="#" class="btn" title="Favourites"><i class="fa fa-2x fa-star yellow-text"></i></a></li>
                    <li><a href="#" class="btn" title="Subscriptions"><i class="fa fa-2x fa-rss-square orange-text"></i></a></li>
                </ul>
            </div>
            <div class="navbar-collapse collapse" id="footer-body">
                <ul class="nav navbar-nav">
                    <li><a href="#">Browse Our Library</a></li>
                    <li><a href="#">About Us</a></li>
                    <li><a href="#">Contact Us</a></li>
                    <li><a href="#">Our Partners</a></li>
                    <li><a href="#">User Review</a></li>
                    <li><a href="#">Terms &amp; Conditions</a></li>
                    <li><a href="#">Privacy Policy</a></li>
                </ul>
            </div>
        </div>
    </div>
</footer>