CODEWITHSUNDEEP
htmlcsstwitter-bootstrap-3bootstrap-grid
kam773
kam773

Reputation: 83

sticky navbar doesn't scroll

I'm building a website with bootstrap 3 and I want to have navbar like on this example http://htmlmystore.justthemevalley.com/bigstart/Version3/index.html I'm done with static navbar i'ts wrapped with container div and I tried to implement sticky navbar from here: https://www.w3schools.com/howto/howto_js_navbar_sticky.asp but it doesn't work properly it add sticky class but the width of navbar is full only from the right side, the left side still has gutter and when I scroll back up sticky class is not removed and I have sticky nav all the time. Here is my html code for nav:

  <nav id="navbar" class="navbar navbar-default">
                    <div class="container">
                        <ul class="nav navbar-nav">
                            <li class="nav-item"><a href="#">1</a></li>
                            <li class="nav-item"><a href="#">2</a></li>
                            <li class="nav-item"><a href="#">3</a></li>
                            <li class="nav-item"><a href="#">4</a></li>
                            <li class="nav-item"><a href="#">5</a></li>
                            <li class="nav-item"><a href="#">6</a></li>
                            <li class="nav-item"><a href="#">7</a></li>
                        </ul>
                    </div>
                </nav>

Upvotes: 0

Views: 438

Answers (1)

QQstyle
QQstyle

Reputation: 36

I don't understand the real problem, but it works...

window.onscroll = function() {myFunction()};

Check this Fiddle

Upvotes: 1

Related Questions