[1.2] Remove scrollbar

[elboletaire]

Under firefox (sorry, I've not tested it under other browsers) when opening a picture on your demo whether in fullscreen or not, the scrollbar of the browser is shown/not hidden.

Removing it would be awesome and does not take too much effort :smile: .

[sachinchoolur]

Hi, I am actually confused about this.. Could you please add this suggestion in the comment section so we can decide it according to the number of votes..

Thanks..

[elboletaire]

Well... it's a basic feature of any slideshow/gallery...

[elboletaire]

I'm sorry but I'm not gonna use disquss for a bug report...

[sachinchoolur]

First of all, I can not consider this as a bug. I tried without scrollbar in the beginning of development and it was giving some flickering effect while opening the gallery. That is why I decided to keep scrollbar as it is...

You can just google jquery lightbox gallery and check some lightbox galleries. Most of them retain the scrollbar.

Thank you for your suggestions and contributions so far..

[elboletaire]

I would agree with you if this was not a fullscreen gallery, but it is.

Check out this link and you'll see that almost every fullscreen gallery removes the scrollbars:

http://smashfreakz.com/2012/08/jquery-plugin-for-fullscreen-image-gallery/

[smerriman]

I'm not sure why this issue got closed, but I agree the scrollbar does not look good in full-screen mode.

[mervick]

+1

[HarryVienna]

I just had the same problem and wondered why the scrollbar isn't hidden.

I solved it with two lightgallery events. Works finde for me. My code looks like this:

`

$(document).ready(function() {
    var $gallery = $('#gallery');

    $gallery.lightGallery({
        selector: '.thumb',
        thumbnail:false,
        hideBarsDelay: 1000
    });

    $gallery.on('onBeforeOpen.lg', function(event, prevIndex, index) {
        $('body').css('overflow', 'hidden')
    });
    $gallery.on('onBeforeClose.lg', function(event, prevIndex, index) {
        $('body').css('overflow', 'auto')
    });
});

`

[ElForastero]

Add an option for overflow: hidden, cause this is realy a problem.

[a1studmuffin]

Thanks @HarryVienna, your solution worked perfectly. For my site I had to change the selector to $('html') instead of $('body').

[santowilem]

Simple way with css only

.lg-on {
    overflow: hidden;
}

[MaestroMagnifico]

$lg.on('onAfterOpen.lg',function(event){
    $('html').addClass('lg-on');
});
$lg.on('onCloseAfter.lg',function(event){
    $('html').removeClass('lg-on');
});

html.lg-on {
    overflow: visible !important;
    width: auto;
}

body.lg-on {
    overflow: hidden !important;
}

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. If the issue is still valid for version 2.x, please re-open. Apologize for not responding on time. Thank you for your contributions.