我是新来的，赠送一个自编DHTML特效先！

aotianlong 2003-05-03 02:38:33

<html>
<head>
<meta charset="gb2312">
<title>超级窗口</title>
<script language="javascript">
/****************************超级窗口***************************
傲天龙写于2003.5.3 QQ:12701586 EMAIL:aotianlong@2911.net

目前已经完成：
1.双击标题最大化跟还原
2.可以随便移动
3.可以区分聚焦
4.能够自由变换窗口大小

更多其他功能，需要完善中...(等我实在没劲的时候再完成吧^__^)

****************************************************************/
var itsPosLeft,itsPosTop,itsX,itsY,itsPosWidth,itsPosHeight;
var canDrag = false;

function WindowTitle_mouseDown()
{
if(event.button==1)
{
canDrag = true;
itsX = event.clientX;
itsY = event.clientY;
}
}

var MainWindow_isFocus = false;
function MainWindow_mouseDown()
{
MainWindow_isFocus = true;
}
var bdMousedown = false;
function Body_mouseDown()
{
if(MainWindow_isFocus)
{
WindowTitle.style.backgroundColor="activecaption";
WindowTitle.style.color="captiontext";
}
else
{
WindowTitle.style.backgroundColor="inactivecaption";
WindowTitle.style.color="inactivecaptiontext";
}
MainWindow_isFocus = false;
bdMousedown = true;
itsPosLeft = MainWindow.style.posLeft;
itsPosTop = MainWindow.style.posTop;
itsPosWidth = MainWindow.style.posWidth;
itsPosHeight = MainWindow.style.posHeight;
if(canResize)
MainWindow.style.borderColor="activeborder";
}

function Body_mouseUp()
{
bdMousedown = false;
itsErrer = 2; //恢复被修改的误差值
MainWindow.style.borderColor="";
}

function WindowTitle_mouseUp()
{
canDrag = false;
canResize = false;
}

var canResize = false;
var itsErrer = 2; //设置误差，能够使得让鼠标更容易取得变形点
function Body_mouseMove()
{
//检测变形
var evtX,evtY,MWwidth,MWheight,MWleft,MWtop;
evtX = event.clientX;
evtY = event.clientY;
MWwidth = MainWindow.offsetWidth;
MWheight = MainWindow.offsetHeight;
MWleft = MainWindow.style.posLeft;
MWtop = MainWindow.style.posTop;

var isLeft,isRight,isTop,isBottom,isLeftTop,isLeftBottom,isRightTop,isRightBottom;//定义八个

位置的BOOL值

var bX,sX,bY,sY;

bX = evtX+itsErrer;
sX = evtX-itsErrer;
bY = evtY+itsErrer;
sY = evtY-itsErrer;

isRight = bX>MWwidth+MWleft&&sX<MWwidth+MWleft;
isLeft = bX>MWleft&&sX<MWleft;
isTop = bY>MWtop&&sY<MWtop;
isBottom = bY>MWtop+MWheight&&sY<MWheight+MWtop;
isLeftTop = isLeft&&isTop;
isLeftBottom = isLeft&&isBottom;
isRightTop = isRight&&isTop;
isRightBottom = isRight&&isBottom;
if(isRight||isLeft||isTop||isBottom)
{
if(isRight||isLeft)
document.body.style.cursor="w-resize";
if(isTop||isBottom)
document.body.style.cursor="n-resize";
if(isRightTop||isLeftBottom)
document.body.style.cursor="sw-resize";
if(isLeftTop||isLeftBottom)
document.body.style.cursor="nw-resize";
canResize = true;
}
else
{
document.body.style.cursor="default";
canResize = false;
}
if(canDrag) //处理拖曳
{
MainWindow.style.posLeft = itsPosLeft - itsX + event.clientX;
MainWindow.style.posTop = itsPosTop - itsY + event.clientY;
}

//处理窗口大小操作
if(bdMousedown&&canResize)
{
itsErrer = 50
if(isLeft)
{
MainWindow.style.posLeft = event.clientX;
MainWindow.style.width = itsPosWidth - event.clientX + itsPosLeft;
}
if(isRight)
{

MainWindow.style.posLeft = itsPosLeft;
MainWindow.style.width = event.clientX- itsPosLeft
}
if(isTop)
{
MainWindow.style.posTop = event.clientY;
MainWindow.style.height = itsPosHeight - event.clientY + itsPosTop;
}
if(isBottom)
{
MainWindow.style.posTop = itsPosTop;
MainWindow.style.height = event.clientY - itsPosTop;
}
}
}

var maxSize = false;
//初始化窗口的高度，宽度，跟位置，如果修改下面的值可以修改窗口的属性
var itsWidth = 400;
var itsHeight = 300;
var itsTop=0;
var itsLeft=0;
function WindowTitle_dblClick() //处理最大化跟最小化事件
{
if(!maxSize)
{
itsTop = MainWindow.style.posTop;
itsLeft = MainWindow.style.posLeft;
itsWidth = MainWindow.style.posWidth;
itsHeight = MainWindow.style.posHeight;
MainWindow.style.width = document.body.clientWidth;
MainWindow.style.height = document.body.clientHeight;
MainWindow.style.top = 0;
MainWindow.style.left = 0;
maxSize = true
}
else
{
MainWindow.style.width = itsWidth;
MainWindow.style.height = itsHeight;
MainWindow.style.top = itsTop;
MainWindow.style.left = itsLeft;
maxSize = false;
}
}
</script>
</head>
<body onselectstart="return false" onmousedown="Body_mouseDown()" onmousemove="Body_mouseMove()"

onmouseup="Body_mouseUp()">

<table border=1 cellspacing=0 width=100% id="MainWindow"

style="position:absolute;top:expression(itsTop);left:expression(itsLeft);width:expression(itsWidt

h);height:expression(itsHeight)" onmousedown="MainWindow_mouseDown()">
<tr>
<td style="background-color:activecaption;height:20px;color:captiontext" id="WindowTitle"

ondblclick="WindowTitle_dblClick()" onmousedown="WindowTitle_mouseDown()"

onmouseup="WindowTitle_mouseUp()">

超级窗口</td>
</tr>
<tr>
<td valign="top" id="WindowBody">


</td>
</tr>
</table>

</body>
</html>

...全文