search

Codeinwp / Nivo-Lightbox-jQuery

A simple, flexible, responsive, retina-ready jQuery lightbox plugin.
http://dev7studios.com/nivo-lightbox
MIT License
157 stars 87 forks source link

Nivo Lightbox - scrolling issue while in mobile view #34

Open krzysztofbalana opened 10 years ago

krzysztofbalana commented 10 years ago

I'm struggling with Nivo Lightbox on my personal portfolio site. Unfortunately I can't make it act correctly on mobile browsers, some scrolling problems occurs.

Please check on android browser, mobile chrome etc. http://www.krzysztofbalana.pl and try to open random project. On mobile you'll see that while trying to scroll down foreground content, background is being scrolled instead of project description.

Thanks in advance! Christopher

ESalek commented 9 years ago

I have the same issue. Did you find a fix for it?

jsaleigh commented 9 years ago

In 'nivo-lightbox.css', change the styling for .nivo-lightbox-overlay to the following:

.nivo-lightbox-overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99998;
    width: 100%;
    height: 100%;
    overflow: auto; /* this was set to hidden, but should be auto for this fix */
    -webkit-overflow-scrolling: touch; /* this is new */
    visibility: hidden;
    opacity: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}