Tag Archives: bootstrap

Twitter Bootstrap without jQuery

Twitter Bootstrap web pageThe more I use Twitter Bootstrap, the more I like it. The only thing that puts me off is needing jQuery for a few simple interactions such as hiding and displaying elements. jQuery’s an excellent library but if a site doesn’t make full use of it, it can be overkill, adding unnecessary bytes to your pages. As a replacement, I tried to make a lightweight alternative script specifically for Bootstrap.

Download it here

To use the script just put it in your pages, preferably at the bottom, instead of jQuery and the Bootstrap plugin scripts, like so:

    ...
    <script src="bootstrap-without-jquery.min.js"></script>
  </body>
</html>

The benefit is better performance thanks to faster page load times. It obviously doesn’t do everything that jQuery and the Bootstrap plugins do but it should be enough if you just want:

  • working dropdown menus;
  • dismissable alert boxes;
  • a collapsible navigation menu triggered by the “hamburger” button.

I tested it on several mobile and desktop browsers, including IE 8, but I’d appreciate further reports of where it does or doesn’t work. There may also be other Bootstrap components that require JavaScript so I can add support for those if there’s demand (or you can send a pull request). The GitHub page is here along with more details of browser support: github.com/tagawa/bootstrap-without-jquery

I’ve also prepared a simple Bootstrap demo page for testing. As always, feedback is welcome!

Update:

There’s also a good resource encouraging developers to use plain JavaScript where jQuery may not be necessary, with JavaScript code snippets that correspond to jQuery methods: YouMightNotNeedjQuery.com