Comment puis-je changer la couleur du titre de la boîte de dialogue dans jquery ui?

Question

J'ai quelque chose comme ça:

$div = $('<div id="error" title="Error">');
$div.append('<p>Hi</p>');

$div.dialog({
    modal: true,
    maxHeight:500,
});

Puis-je changer la couleur de fond du titre de la boîte de dialogue comme ceci?:

 $div.dialog({
        modal: true,
        maxHeight:500,
    }).find(".ui-dialog-titlebar").css("background-color","red");

Answer 1

Utilisez prev() au lieu de find() car cet élément n'est pas à l'intérieur de $div:

$div.dialog({
    modal: true,
    maxHeight:500,
}).prev(".ui-dialog-titlebar").css("background","red");

J'utilise aussi background pour écraser tous les autres éléments comme background-image

Vérifiez ceci http://jsfiddle.net/Ad7nF/

Answer 2

Une autre méthode à faire est de: 

Définissez votre classe de style - myTitleClass

Définir le css comme 

  . myTitleClass .ui-dialog-titlebar {
          background:red;
    }

et ajoutez la classe personnalisée à la fonction d'initialisation du dialogue: 

     $( "#dialog" ).dialog({
        autoOpen: false,
        dialogClass: 'myTitleClass'
     });

JSFiddle - (mais avec un autre exemple de code)

http://jsfiddle.net/khVYj/3/

Answer 3

La manière la plus simple est la suivante: -

.ui-dialog-titlebar {
      background:red;
}