jQuery ui dialog image for the title

Question

Is it possible when specifying a jQuery UI dialog box, to have an image be placed for my title instead of just plain text?

Thanks

Answer 1

You can provide any HTML as the title option, like this:

$("#dialog").dialog({
  title: '<img src="myImage.jpg" />'
});​​​​​​​​​​​

You can see an example in action here

---

Or, as another demo to annoy the hell out of your users, you could do this:

$("<div />").dialog({
  title: '<marquee>Hello</marquee>'
});​

Answer 2

You can set it using HTML as well, Though dialog takes text as title but you can change it by extending dialog property like

    $(document).ready(function() {   

        $.widget("ui.dialog", $.extend({}, $.ui.dialog.prototype, {
    _title: function(title) {
        var $title = this.options.title || ' '
        if( ("titleIsHtml" in this.options) && this.options.titleIsHtml == true )
            title.html($title);
        else title.text($title);
    }
     }));



  $('div#thedialogg').dialog({ 
         title:"<img src='images/logo-new.png' class='logo_size'>",
         titleIsHtml:true,
         autoOpen: false,
         height: 581,
         width: 1000,   
         modal: false,
         draggable: false,
         resizable: false,
         position: 'center'

     })
})