jQuery Dialog example

this dialog example should replace the Prototype ModalBox (okonet.ru) which is used along our customers pages.

by Roberto Apasajja

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/ui-lightness/jquery-ui.css">
<p>Hello World!
</p>

<div id="dialog-message" title="Kami telah Berpindah | We've Moved">
    <div style="margin-left: 20px;">
        <br>We've moved to <a href="http://tensho.my">Tensho.my</a>
        <br>Kami telah berpindah ke <a href="http://tensho.my">Tensho.my</a>
    </div>
</div>

CSS

body { font: normal normal normal 12px/1.5 Arial, Helvetica, sans-serif; }

.ui-dialog-osx {
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px; border-width: 8px;
}

.ui-dialog-osx a{color:green}

JavaScript

$("#dialog-message").dialog({
    modal: true,
    draggable: false,
    resizable: false,
    position: ['center', 'middle'],
    show: 'blind',
    hide: 'blind',
    width: 280,
    height: 180,
    dialogClass: 'ui-dialog-osx',
    buttons: {
        "I understand | Saya faham": function() {
            $(this).dialog("close");
        }
    }
});