<!DOCTYPE html>
<
html
>
<
head
>
<
meta
http-equiv
=
"Content-Type"
content
=
"text/html; charset=utf-8"
/>
<
link
href
=
"jquery-ui.structure.min.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
id
=
"themecss"
href
=
"jquery-lwd/themes/windows2000/jquery-ui.theme.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
href
=
"jquery-lwd/jquery-lwd.structure.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
script
type
=
"text/javascript"
src
=
"jquery.min.js"
>
</
script
>
<
script
type
=
"text/javascript"
src
=
"jquery-ui.min.js"
>
</
script
>
<
script
type
=
"text/javascript"
src
=
"jquery-lwd/jquery-lwd.js"
>
</
script
>
</
head
>
<
body
>
<
div
id
=
"taskbar"
>
<
div
id
=
"lwd-taskbar-left"
style
=
"display:inline-block"
>
<
button
id
=
"addWindowbuttonID"
class="ui-button lwd-taskbar-button
ui-state-default ui-corner-all">
Add new window
</
button
>
<
div
class
=
"taskbar-spacer"
></
div
>
</
div
>
</
div
>
</
body
>
<
script
>
$(document).ready(function () {
var intCounter = 1;
/* On click event of button,
new window is added */
$('#addWindowbuttonID').click(function () {
var $objWindow = $('<
div
class
=
"window"
>Window '
+ intCounter + '</
div
>');
var intRandom = Math.floor(
(Math.random() * 12) + 1);
$($objWindow).appendTo('body');
$objWindow.window({
title: 'My window ' + intCounter,
width: 480,
height: 320,
position: {
my: 'left+' + 200 + ', top+' + 200,
at: 'left top',
of: window
},
maximizable: true,
minimizable: true,
icon: 'src/jquery-lwd/themes/windows2000/'
+ 'images/icons/' + intRandom + '.png'
});
intCounter++;
});
$('#taskbar').taskbar();
$('#theme').change(function () {
$("head link#themecss").attr("href", $(this).val());
});
});
</
script
>
</
html
>