注意： 该程序在IE调试的，其他浏览器可能有BUG，见谅！
复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312">
<title>Insert title here</title>
<!--
-- CSS
-- set window style
-->
<link type="text/css" href="https://www.jb51.net/main.css" />
<!--
-- JavaScript
-- set function
-->
<script language="JavaScript" src="https://www.jb51.net/mywindow.js"> </script>
<script>
alert("XP Window以IE测试,其他浏览器可能有BUG请见谅! 基本功能+四边四角顶部拖拉都已实现!")
alert("进行操作前,记得先初始化窗口哦!");
/*
* create xp window and initialize
*/
var myW = new MyWindow();
function initialize() {
myW.setBackgroundDiv("mywindow");
myW.setLeftDiv("mywindow_left");
myW.setRightDiv("mywindow_right");
myW.setBottomDiv("mywindow_bottom");
myW.setTopDiv("mywindow_top");
myW.initialEvent();
}
/*
* list button event function
*/
function hiddenWindow() {
myW.hidden();
}
function showWindow() {
myW.show();
}
function setAdjust(adj) {
myW.setAdjust(adj);
}
function showMaxSize() {
myW.showMaxSize();
}
function getTop() {
myW.getTop();
}
function getLeft() {
myW.getLeft();
}
function getWidth() {
myW.getWidth();
}
function getHeight() {
myW.getHeight();
}
function removeWindow() {
myW.removeWindow();
}
function addObject() {
myW.addObject();
}
function deleteObject() {
myW.deleteObject();
}
/*
* drag operation event function
*/
function start(idName) {
myW.start(idName);
}
function move(idName) {
myW.move(idName);
}
function end(idName) {
myW.end(idName);
}
</script>
</head>
<body>
<!--
-- set list button
-->
<ul>
<li><a href="#">初始化窗口</a></li>
<li><a href="#">隐藏窗口</a></li>
<li><a href="#">显示窗口</a></li>
<li><a href="#">设置窗口可调整大小</a></li>
<li><a href="#">设置窗口不可调整大小</a></li>
<li><a href="#">最大化窗口</a></li>
<li><a href="#">在窗口中添加对象 </a></li>
<li><a href="#">删除对象</a></li>
<li><a href="#">得到Top的值</a></li>
<li><a href="#">得到Left的值</a></li>
<li><a href="#">得到Width的值</a></li>
<li><a href="#">得到Height的值</a></li>
<li><a href="#">释放窗口资源</a></li>
</ul><br>
<!--
-- set every div of window
-- because cover proble, so order of set div is bottom, right/left, central, last top
-->
<div>
<!-- set bottom div -->
<div>
<div onmousedown="start('mywindow_botton_right_corner');"
onmousemove="move('mywindow_botton_right_corner');"
onmouseup="end('mywindow_botton_right_corner');">
</div>
</div>
<!-- set right div -->
<div onmousedown="start('mywindow_right');" onmousemove="move('mywindow_right');"
onmouseup="end('mywindow_right');">
</div>
<!-- set left div -->
<div onmousedown="start('mywindow_left');" onmousemove="move('mywindow_left');"
onmouseup="end('mywindow_left')";>
</div>
<!-- set central div, it is added object -->
<div id = "central"></div>
<!-- set top div -->
<div onmousedown="start('mywindow_top');" onmousemove="move('mywindow_top');"
onmouseup="end('mywindow_top');">
<div>
</div>
<div>
<img src="https://www.jb51.net/image/window_control_close_blur.bmp"
/>
<img src="https://www.jb51.net/image/window_control_max_blur.bmp"
/>
<img src="https://www.jb51.net/image/window_control_min_blur.bmp"
/>
</div>
<div>
</div>
</div>
<!-- set corner of drag window -->
<div onmousedown="start('mywindow_right_corner');" onmousemove="move('mywindow_right_corner');"
onmouseup="end('mywindow_right_corner');">
</div>
<div onmousedown="start('mywindow_left_corner');" onmousemove="move('mywindow_left_corner');"
onmouseup="end('mywindow_left_corner');">
</div>
<div onmousedown="start('mywindow_rBottom_corner');" onmousemove="move('mywindow_rBottom_corner');"
onmouseup="end('mywindow_rBottom_corner');">
</div>
<!-- set border of drag window -->
<div onmousedown="start('mywindow_top_drag');" onmousemove="move('mywindow_top_drag');"
onmouseup="end('mywindow_top_drag');"></div>
<div onmousedown="start('mywindow_bottom_drag');" onmousemove="move('mywindow_bottom_drag');"
onmouseup="end('mywindow_bottom_drag');"></div>
</div>
</body>
</html>
复制代码 代码如下: