Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

100
Vistas
disable browser scrolling while jQuery UI modal dialog is open

is it possible to disable scrolling in browser (just for browser's scrollbars) while a jQuery UI modal dialog is open.

Note: I do want scrolling to be enabled inside the dialog

over 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

$(formObject).dialog({
 create: function(event, ui) {
  $("body").css({ overflow: 'hidden' })
 },
 beforeClose: function(event, ui) {
  $("body").css({ overflow: 'inherit' })
 }
});

Or as I allude to in the comment below:

var dialogActiveClassName="dialog-active";
var dialogContainerSelector="body";

$(formObject).dialog({
 create: function(event, ui) {
   $(dialogContainerSelector).addClass(dialogActiveClassName);
 },
 beforeClose: function(event, ui) {
   $(dialogContainerSelector).removeClass(dialogActiveClassName);
 }
});

But actually to be honest, you should ensure that creating a dialog bubbles an event up to your window object where you'd be watching for said events, roughly something like this pseudo:

var dialogActiveClassName="dialog-active";
var dialogContainerSelector="body";
$(window).on("event:dialog-opened", function(){
    $(dialogContainerSelector).addClass(dialogActiveClassName);
});
$(window).on("event:dialog-closed", function(){
    $(dialogContainerSelector).removeClass(dialogActiveClassName);
});
over 4 years ago · Santiago Trujillo Denunciar

0

I needed to do exactly the same thing, do it simply by adding a class to the body:

.stop-scrolling {
  height: 100%;
  overflow: hidden;
}

Add the class then remove when you want to re-enable scrolling, tested in IE, FF, Safari and Chrome.

$('body').addClass('stop-scrolling')
over 4 years ago · Santiago Trujillo Denunciar

0

JS Bin reference for CSS overflow

Simply Add

$('body').css('overflow','hidden');

to your function that shows the modal.

And

$('body').css('overflow','scroll');

to your function that closes the modal.

over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda