No se puede diseñar el estado activo del botón para cerrar el diálogo de jqueryUI

Question

Deseo aplicar estilo al estado activo del botón Cerrar (en la barra de título) en el cuadro de diálogo de jqueryUI. He diseñado su estado normal y: hover estado bien. Pero el: estado activo nunca parece desencadenar.

¿Hay algo en el complemento que impida que: el estado activo en el enlace del botón de cierre funcione? ¿Se puede cambiar esto para que funcione?

He aquí un ejemplo del problema: View example

Answer 1

Es consecuencia de la desactivación de la selección de TitleBar of Dialog Widget en el navegador que no admite el evento 'select astart'. Para esos navegadores ellos deshabilitan el evento 'mousedown' en su lugar.

línea 145: jquery.ui.dialog.js

 uiDialogTitlebar.find("*").add(uiDialogTitlebar).disableSelection(); 

la línea 120: jquery.ui.core.js

disableSelection: function() { 
    return this.bind(($.support.selectstart ? "selectstart" : "mousedown") + 
     ".ui-disableSelection", function(event) { 
      event.preventDefault(); 
     }); 
}, 

enableSelection: function() { 
    return this.unbind(".ui-disableSelection"); 
} 

esta manera puede utilizar EnableSelection() o desvincularla mismo

Answer 2

El estado :active se activa sólo cuando se hace clic. En ese punto, su diálogo se cerrará inmediatamente, así que dudo que pueda ver su estado. ¿Puedes dar un ejemplo si esto no responde a tu pregunta?

Answer 3

Teniendo en cuenta los comentarios de @Bizniztime, ¿por qué no hacer esto en javascript?

$(".ui-dialog-titlebar-close").mousedown(function() { 
    $(this).css("background", "#000"); 
}).mouseover(function() { 
    $(this).css("background", "#0F0");  
}).mouseout(function() { 
    $(this).css("background", "#F00");  
}); 

También puede añadir/eliminar clases ...