Change Bootstrap 3 Navicon on toggle
I’ve been looking at how to change the button icon which is shown across Bootstrap 3 navigation menus in a mobile viewport.
For months I’ve come across a whole variety of clever Navicon icons which change when clicked upon.
I wanted to implement this feature into a Bootstrap navigation menu. In the end, I used a couple small lines of code which use jQuery.
The code toggles between two CSS classes. The toggle is activated when the menu button is pressed.
As I am using FontAwesome icons, this uses class names. Therefore toggling between two CSS classes will change the FontAwesome icons which are used in the menu.