CODEWITHSUNDEEP
jqueryjquery-ui
Thomas
Thomas

Reputation: 34208

Need to change jquery dialog title bar image

I tried to change the jQuery dialog title bar image using the below code but it does not work.

My dialog & title bar image look like this:

enter image description here

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

Any advise on how to change it? Thanks

Upvotes: 0

Views: 3065

Answers (2)

Tats_innit
Tats_innit

Reputation: 34117

This code will give a very good idea how to do this:

jQuery: 

var $Dialog_div;

function fnOpenDialog() {
    $Dialog_div = $('<div id=\'ThisDialog\'>Hello</div>').prependTo('body');

    $Dialog_div = $('#ThisDialog').dialog({
        autoOpen: true,
        draggable: true,
        resizable: true,
        title: 'Dialogimage<img src="http://dummyimage.com/100x30/000/fff&text=I\'m+an+image,+hi!" />',
        modal: true,
        stack: true,
        height: ($(window).height() * 0.95),
        width: ($(window).width() * 0.9),  
        buttons: {
            'OK': function() {
                $Dialog_div.dialog('close');
            }
        }
    });  
}

$('#ClickMe').click(fnOpenDialog);​

HTML:

<!-- This is more than likely an Adobe issue where it thinks it should be in the front
     all the time no matter what however it is very annoying that you can't open
     a dialog over a PDF-->

<body>
    <div id='ClickMe'>Click here!</div>
    <br/>
    <div></div>
    <br/>      
</body>

(It might be a coincidence that the image of your dialog is quite similar to sample here: jQuery ui dialog image for the title :))

Working demo:

http://jsfiddle.net/V5NkV/ or http://jsfiddle.net/V5NkV/10/

Click on the click me in the demo above and you will see the dialog window with small image inside it.

Good read link:

http://jqueryui.com/demos/dialog/

Upvotes: 1

ilyes kooli
ilyes kooli

Reputation: 12053

you have to add a CSS rule:

.ui-dialog-titlebar{
    background:url(http://www.elementalsurface.com/beech-wood.jpg);
}​

see the demo

Upvotes: 2

Related Questions