form - slider jquery

¿Cómo se pueden deshabilitar las barras de desplazamiento en el cuadro de diálogo de la interfaz de usuario jQuery?

Question

¿Alguien sabe si hay una forma de deshabilitar las barras de desplazamiento en el cuadro de diálogo de jquery? El contenido que tengo en el div es 300 px pero el diálogo está establecido en 200px. Coloca automáticamente las barras de desplazamiento pero no las quiero. Lo agregaré yo mismo al segundo div que lo hace más grande que la ventana. Cualquier ayuda es apreciada.

Answer 1

¿Te refieres al widget de diálogo jQuery UI ?

Puede pasar una opción cuando la crea para especificar su altura, por ej.

$(''.selector'').dialog({ height: 350 });

Hazlo más alto que el contenido que estás poniendo, y sospecho que estarás dorado.

Answer 2

El desbordamiento: oculto funcionó para mí. Al configurar solo los parámetros de alto / ancho, las barras de desplazamiento seguirán apareciendo según el tamaño del texto y el zoom.

Answer 3

En el ejemplo a continuación también agregué ''resizable = false'' para el diálogo. De modo que no se puede ver ningún texto de desbordamiento al redimensionar el diálogo.

$("a#registerServerStudio , a#regServer").click(function(e) {
//alert("login using POST is Clicked");
e.preventDefault();
registerSuccess = false;
regSSDlg = $("#regSS").dialog({
autoOpen: false,
height: 280,
width: 420,
modal: true,
resizable: false,
buttons: {
},
close: function() {
registerSuccess = false;
},
show:{effect:''bounce'', duration: 100},
});
$(''#regSS'').css(''overflow'', ''hidden'');
regSSDlg.prev(".ui-dialog-titlebar").css({"background":"#47669E", "color":"white", "font-size":"13px", "font-weight":"normal"}) ;
regSSDlg.dialog("open");
});

Answer 4

Esto eliminó las barras de desplazamiento:

$( "#dialog" ).dialog({
autoOpen: false,
resizable: false,
dialogClass: ''info'',
height: ''auto'',
width: ''auto'',
show: { effect: "blind", duration: 1000 },
hide: {effect: "explode", duration: 1000 },
draggable: true,
open: function (event, ui) {
$(this).dialog(''open'');
},
close: function (event, ui) {
cleanup() ;
}
});

Answer 5

No sé exactamente qué quiere decir con un ''cuadro de diálogo de jquery'', pero la forma estándar de deshabilitar las barras de desplazamiento sería establecer la propiedad de desbordamiento del div en ''oculto''

pon esto en tu archivo css:

div.class_name {
overflow: hidden;
}

Answer 6

Resolví el problema así:

.dialog({
title: $(this).attr("data-dialog-title"),
closeOnEscape: true,
close: function () { $(this).remove() },
draggable: true,
position: ''center'',
width: 500,
height: ''auto'',
modal: true,
open: function (event, ui) {
$(''#myDialogId'').css(''overflow'', ''hidden''); //this line does the actual hiding
}
});

Answer 7

Solución sin css o altura fija:

Creo que la mejor solución al problema anterior es hacer que la altura del cuadro de diálogo sea dinámica, la altura debería ajustarse automáticamente según el contenido, cuando el contenido aumenta la altura modal debería aumentar. Para ello, utilice la opción "auto" de altura proporcionada por Jquery UI modal, ajusta la altura modal según el contenido, por lo que necesita agregar ''overflow: hidden'' o ''height: 350''

$( "#dialog" ).dialog({
modal : true,
height:"auto"
});