41、输入密码保护页

41、输入密码保护页

<html>

 

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>网页特效---可以用鼠标拖动的表格</title>

</head>

 

<body>

<SCRIPT LANGUAGE="JavaScript">

<!--

var currentMoveObj = null;    //当前拖动对象

var relLeft;    //鼠标按下位置相对对象位置

var relTop;

function f_mdown(obj)

{

    currentMoveObj = obj;        //当对象被按下时,记录该对象

    currentMoveObj.style.position = "absolute";

    relLeft = event.x - currentMoveObj.style.pixelLeft;

    relTop = event.y - currentMoveObj.style.pixelTop;

}

window.document.onmouseup = function()

{

    currentMoveObj = null;    //当鼠标释放时同时释放拖动对象

}

function f_move(obj)

{

    if(currentMoveObj != null)

    {

        currentMoveObj.style.pixelLeft=event.x-relLeft;

        currentMoveObj.style.pixelTop=event.y-relTop;

    }

}

 

//-->

</SCRIPT>

<BODY>

<TABLE width="100" border=1 onselectstart="return false" style="position:absolute;left:50;top:50" onmousedown="f_mdown(this)" onmousemove="f_move(this)">

<TR>

    <TD bgcolor="#CCCCCC" align="center" style="cursor:move">title1</TD>

</TR>

<TR>

    <TD align="center" height="60">content</TD>

</TR>

</TABLE>

<TABLE width="100" border=1 onselectstart="return false" style="position:absolute;left:350;top:250" onmousedown="f_mdown(this)" onmousemove="f_move(this)">

<TR>

    <TD bgcolor="#CCCCCC" align="center" style="cursor:move">title2</TD>

</TR>

<TR>

    <TD align="center" height="60">content</TD>

</TR>

</TABLE>

</body>

 

</html>

Write a comment

Comments: 0