Recently I started using ThickBox for my modal windowing needs, but wasn't happy with the "close" button that is hard coded into TB_show().

I modified it like so:

function TB_show(caption, url, rel, closeButton) {
    // closeButton can be a fully formed <img> tag or whatever text you want.
    // If not specified, it will be set to the word 'close'. - csj 04/21/2007
    if(!closeButton){
        closeButton = "close";
    }

...

I then made appropriate changes to the lines where the word "close" used to be hard coded. In part, the lines look like this:

<div id='TB_closeWindow'><a href='' id='TB_closeWindowButton' title='Close'>" + closeButton +"</a></div>"

There are three such lines.

I also made a small modification to the CSS. I'm not a CSS expert by any stretch, so if this can be improved then fantastic. This worked for me though.

#TB_closeAjaxWindow{
    padding:5px 5px 7px 0px;
    margin-bottom:1px;
    text-align:right;
    float:right;
}

The change was really just to the padding.

Also, the image I used was 16x16 and in order for things to look right I had to set the images margin and padding to 0px.

The finished window looks like this (I hope this turns out for folks):



Thoughts, comments? Am I nuts? I hope the image turns out for everyone.

Cheers,
Chris




-- 
http://cjordan.info


Reply via email to