Bootstrap hamburger and jquery versions


#1

Hi. I’ve been building a navigation bar in CodePen for my portfolio page and following some templates/examples for creating one that collapses into a hamburger when the screen size decreases.

I’ve got it working now, but what I don’t understand is why I need:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

and not the version CodePen loads through its “Add External JavaScript” option, i.e.:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

You can see my pen (very much a WIP) if need be at https://codepen.io/cakeisaliegaming/pen/BdaVVe


#2

jQuery 3.2.1 works great with Bootstrap 3.3.7. In your codepen’s JavaScript settings, make sure jQuery is listed above bootstrap.js and everything will work fine. Right now, you have bootstrap.js loading before the jQuery it needs to make the hamburger menu work.


#3

That never even occurred to me! Thanks so much for the help :smile: