jQuery

【jQuery】HTML、CSS、JavaScriptを使用したスティッキーナビゲーションバーSticky Navigation Bar

December 1, 2017
sticky-navigation-bar

Sticky Navigation BarはHTML、CSS、JavaScriptを使用したスティッキーナビゲーションバー。

HTML

    <nav id="header-nav" class="nav">
        <div class="container">
            <div class="pull-left">
                <h1 class="site-title">Site Name</h1>
                <div class="pull-right">
                    <ul class="nav-list">
                        <li>Home</li>
                        <li>About</li>
                        <li>Contact Us</li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>    

JS

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript" src="main.js"></script>