Cuadro de diálogo jquery UI: ¿cómo inicializar sin una barra de título?
¿Es posible abrir un cuadro de diálogo jQuery UI sin una barra de título?
Creo que la mejor solución es utilizar la opción dialogClass.
Un extracto de los documentos de jquery UI:
durante el inicio: $('.selector').dialog({ dialogClass: 'noTitleStuff' });
o si quieres después de init. :
$('.selector').dialog('option', 'dialogClass', 'noTitleStuff');
Entonces creé un diálogo con la opción dialogClass='noTitleStuff' y el CSS así:
.noTitleStuff .ui-dialog-titlebar {display:none}
demasiado simple!! pero me tomé 1 día para pensar por qué mi método anterior de perforación de clase id->no funcionaba. De hecho, cuando llamas .dialog()al método div, te transformas en hijo de otro div (el div de diálogo real) y posiblemente en un "hermano" del titlebardiv, por lo que es muy difícil intentar encontrar este último a partir del primero.
Descubrí una solución para eliminar dinámicamente la barra de título.
$("#example").dialog(dialogOpts);
// remove the title bar
$(".ui-dialog-titlebar").hide();
Esto eliminará todos los elementos con la clase 'ui-dialog-titlebar' después de que se represente el cuadro de diálogo.
Creo que puedes ocultarlo con CSS:
.ui-dialog-titlebar {
display: none;
}
Alternativamente, puedes aplicar esto a cuadros de diálogo específicos con la dialogClassopción:
$( "#createUserDialog" ).dialog({
dialogClass: "no-titlebar"
});
.no-titlebar .ui-dialog-titlebar {
display: none;
}
Consulte " Tematización " del diálogo. La sugerencia anterior hace uso de la dialogClassopción, que parece estar desapareciendo en favor de un nuevo método.
Yo uso esto en mis proyectos.
$("#myDialog").dialog(dialogOpts);
// remove the title bar
$("#myDialog").siblings('div.ui-dialog-titlebar').remove();
// one liner
$("#myDialog").dialog(dialogOpts).siblings('.ui-dialog-titlebar').remove();
