Desaparecendo barras de rolagem em pop-ups

Ao usar o lightbox ou qualquer outro popup em um site, um problema típico é lidar com as barras de rolagem da página principal.

Adicionar overflow: hidden;o corpo ao abrir o pop-up e removê-lo no fechamento apenas ocultaria a barra de rolagem e desabilitaria a rolagem. Isso é bom em um mac típico, onde você não tem nenhuma barra de rolagem visível, a menos que você esteja, de fato, rolando.

Mas quando você conecta um mouse ou usa qualquer outro sistema, está tendo problemas, porque agora, as barras de rolagem estão visíveis o tempo todo. A adição simples overflow: hidden;não funciona mais, porque a página subjacente do popup saltaria, porque a barra de rolagem desaparece.

A solução é encontrada no stackoverflow

Primeiro, você precisa de uma classe css

html.noscroll {
position
: fixed;
overflow
-y: scroll;
width
: 100%;
}

Em seguida, execute este código ao abrir o pop-up

if ($(document).height() > $(window).height()) {
var scrollTop = ($('html').scrollTop()) ? $('html').scrollTop() : $('body').scrollTop(); // Works for Chrome, Firefox, IE...
$
('html').addClass('noscroll').css('top',-scrollTop);
}

Por último, mas não menos importante, você precisa deste snippet para ser executado ao fechar o pop-up

var scrollTop = parseInt($('html').css('top'));
$
('html').removeClass('noscroll');
$
('html,body').scrollTop(-scrollTop);

é isso aí.