JQuery UI Dialog

by Taufik Nurrohman

HTML

<link rel="stylesheet" href="http://hompimpa.googlecode.com/svn/trunk/Lipsum-UI/css/ui-custom-theme.css">
<script src="http://hompimpa.googlecode.com/svn/trunk/Lipsum-UI/js/jquery-ui-1.8.16.custom.min.js"></script>
<button>Nonton Televisi!</button>
<div id="dialog"><iframe src="http://www.youtube.com/embed/-joKveiaabA"></iframe></div>

CSS

body {padding:50px}

#dialog {display:none}

.ui-dialog .ui-dialog-content {padding:0 0 !important}

iframe {display:block;border:none;width:100%;height:200px}

JavaScript

$(function() {
    $('button').click(function() {
        $('#dialog').dialog({
            title: "Cerita Binatang",
            width: 350,
            height: 245
        });
    });
});