CODEWITHSUNDEEP
csstwitter-bootstrapgoogle-chrome
Khin L
Khin L

Reputation: 115

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

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.

Upvotes: 9

Views: 5749

Answers (2)

Marek Lisý
Marek Lisý

Reputation: 3401

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);
}

Upvotes: 16

mahn0
mahn0

Reputation: 1

I have this problem too. Win7 Chrome 41 and 42beta & Linux Chrome 41. My temporary solution: set viewport height + 1px to page by js to have scrollbar active every time.

Upvotes: 0

Related Questions