Skip to content
A modification of the Twitter Bootstrap Modal plugin - allows for any height modal with full page scrolling of said modal.
Branch: master
Clone or download
aroc Update
</project> :(
Latest commit d3baaf1 Jul 30, 2013
Type Name Latest commit message Commit time
Failed to load latest commit information.
bootstrap-scroll-modal.css Removed fade on example modal. Increased margin to 100px. Dec 3, 2012

Notice: You no longer need this project

I built this project because I (and apparently some other people) found this very useful at the time. However, a scrolling modal is now a standard part of Bootstrap 3.0. If what's included in 3.0 doesn't suit your needs or you're still using Bootstrap < 3, then check out

Bootstrap Scroll Modal v 1.2

Twitter Bootstrap's current modal has a fixed height and scrolls long content inside of it. This version of the plugin, along with some minimal CSS allows you to have a modal that acts more like Facebook and Trello modals, where the content can be any height and the whole page scrolls, rather than internal scrollbars in the modal. View it in action here.

How to Use

Simply use this version of the Modal Plugin rather than Twitter Bootstraps. It works exactly the same way the original plugin does. There are only minor differences which relate to how the HTML markup is inserted, which allows for the full page scroll.

Then include the Stylesheet. Ensure to include it AFTER bootstrap.css, as it overrides some of the modal classes found in it. You can also just add the minmal CSS to one of your project's CSS files, as long as it comes after Bootstrap.css.

In order to activate the new modal, set the "dynamic" option to "true". If the option is not set, the modal acts the same as it always has - allowing for full backward compatibility.


<a href="myModal" data-toggle="modal" data-dynamic="true">Launch the awesome modal</a>


$("#myModal").modal({ dynamic: true });

Cross-Browser Tested

I've tested the modal on IE7+, Safari, Firefox 4+ and Chrome. Let me know if you find any compatibility issues.

You can’t perform that action at this time.