Responsive Scrolling Navigation In JavaScript – Bungie Bar

Category: Javascript , Menu & Navigation | August 1, 2018
Views Total:2,042 views
Official Page:Go to website
Last Update:August 1, 2018


Responsive Scrolling Navigation In JavaScript – Bungie Bar


Bungie Bar is an inspired responsive navigation that collapses the long horizontal nav into a scrollable menu with left/right navigation arrows on mobile devices.

How to use it:

Insert the Bungie Bar’s JavaScript and Stylesheet into the html document.

<link rel="stylesheet" href="bungie.css">
<script src="bungie.js"></script>

Wrap the regular nav list into a container with the CSS class of ‘bungie’. That’s it.

<div id="bungie">
    <li><a>about us</a></li>
    <li><a>more info</a></li>
    <li><a>privacy policy</a></li>



  • Cleaner scrolling increments: Removed scrolling animation for now, but each step in scrolling is measured by the width of the leftmost visible element, so that elements don’t get partially covered on the left.

You Might Be Interested In:

Leave a Reply