Bootstrap modal stop scrolling on Chrome 41 with mouse scroll/touchpad (but works with up/down keys)

Question

My objective is to get a scrollable bootstrap modal that is taller than my screen.

Problem: On Chrome 41 (but not 40) running on Yosemite OS, my bootstrap modal would stop scrolling after it pops up if the content height is taller than the screen.

What I have tried is: - Straight Bootstrap(v.3.3.1) automatically adds '.modal-open' to the body tag with the property of 'overflow: hidden;'. This causes the modal to be scrollable. - I adjusted the widow size and just by moving a pixel, the modal is scrollable again. - I have tried applying overflow: visible; and etc. to both the body tag and the modal itself but no luck.

Does anyone know what this problem is? Is it a bug Chrome 41 introduced on Yosemite? I am using Bootstrap 3.3.1 currently.

Updated scrolling with up/down arrow keys work fine but not with mouse/touchpad scrolling.

Answer 1

I am experiencing the same issue. After quick search I found that someone already reported this on their GitHub and there is actual fix that was proposed about six days ago, but it hasn't been accepted yet, which means it's not in any stable version right now.

You can apply the proposed fix in your css easily:

.modal.in {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
}