移动按钮

最新推荐文章于 2024-01-20 17:28:29 发布

如锋

最新推荐文章于 2024-01-20 17:28:29 发布

阅读量440

点赞数

分类专栏： Java 文章标签： function null microsoft generator html input

本文链接：https://blog.csdn.net/prufeng/article/details/4040220

版权

Java 专栏收录该内容

31 篇文章 0 订阅

订阅专栏

<!DOCTYPE   HTML   PUBLIC   "-//W3C//DTD   HTML   4.0   Transitional//EN">
<html>
<head>
<title></title>
<meta   name="GENERATOR"   content="Microsoft   Visual   Studio   .NET   7.1">
<meta   name="vs_targetSchema"   content="http://schemas.microsoft.com/intellisense/ie5">
<script>
///
//           This   script   was   designed   by   Erik   Arvidsson   for   WebFX                     //
//                                                                                                                                       //
//           For   more   info   and   examples   see:   http://webfx.eae.net                     //
//           or   contact   Erik   at   http://webfx.eae.net/contact.html#erik           //
//                                                                                                                                       //
//           Feel   free   to   use   this   code   as   lomg   as   this   disclaimer   is             //
//           intact.                                                                                                               //
///

var   checkZIndex   =   true;

var   dragobject   =   null;
var   tx;
var   ty;

var   ie5   =   document.all   !=   null   &&   document.getElementsByTagName   !=   null;

function   getReal(el)   {
temp   =   el;

while   ((temp   !=   null)   &&   (temp.tagName   !=   "BODY"))   {
if   ((temp.className   ==   "moveme")   ||   (temp.className   ==   "handle")){
el   =   temp;
return   el;
}
temp   =   temp.parentElement;
}
return   el;
}


function   moveme_onmousedown()   {
el   =   getReal(window.event.srcElement)

if   (el.className   ==   "moveme"   ||   el.className   ==   "handle")   {
if   (el.className   ==   "handle")   {
tmp   =   el.getAttribute("handlefor");
if   (tmp   ==   null)   {
dragobject   =   null;
return;
}
else
dragobject   =   eval(tmp);
}
else
dragobject   =   el;

if   (checkZIndex)   makeOnTop(dragobject);

ty   =   window.event.clientY   -   getTopPos(dragobject);
tx   =   window.event.clientX   -   getLeftPos(dragobject);

window.event.returnValue   =   false;
window.event.cancelBubble   =   true;
}
else   {
dragobject   =   null;
}
}

function   moveme_onmouseup()   {
if(dragobject)   {
dragobject   =   null;
}
}

function   moveme_onmousemove()   {
if   (dragobject)   {
if   (window.event.clientX   >=   0   &&   window.event.clientY   >=   0)   {
dragobject.style.left   =   window.event.clientX   -   tx;
dragobject.style.top   =   window.event.clientY   -   ty;
}
window.event.returnValue   =   false;
window.event.cancelBubble   =   true;
}
}

function   getLeftPos(el)   {
if   (ie5)   {
if   (el.currentStyle.left   ==   "auto")
return   0;
else
return   parseInt(el.currentStyle.left);
}
else   {
return   el.style.pixelLeft;
}
}

function   getTopPos(el)   {
if   (ie5)   {
if   (el.currentStyle.top   ==   "auto")
return   0;
else
return   parseInt(el.currentStyle.top);
}
else   {
return   el.style.pixelTop;
}
}

function   makeOnTop(el)   {
var   daiz;
var   max   =   0;
var   da   =   document.all;

for   (var   i=0;   i<da.length;   i++)   {
daiz   =   da[i].style.zIndex;
if   (daiz   !=   ""   &&   daiz   >   max)
max   =   daiz;
}

el.style.zIndex   =   max   +   1;
}

if   (document.all)   {   //This   only   works   in   IE4   or   better
document.onmousedown   =   moveme_onmousedown;
document.onmouseup   =   moveme_onmouseup;
document.onmousemove   =   moveme_onmousemove;
}

document.write("<style>");
document.write(".moveme {cursor:   move;position:relative}");
document.write(".handle {cursor:   move;}");
document.write("</style>");

function   keypress(){
var   key=window.event.keyCode;
if(key==27){
txtInput.value   ="";
txtInput.style.display   ="none";
}
if(key==13){
var   txt=document.createElement("span");
txt.className="moveme";
txt.innerText=txtInput.value   ;
txtInput.value   ="";
txt.style.postion="absolute";
txt.style.left=window.event.clientX;
txt.style.top=window.event.clientY;
txtInput.style.display   ="none";
document.body.appendChild(txt);
}
}

</script>
</head>
<body>
<div   id="my"   style="position:absolute;height:50px;width:150px;border:1px   solid   activecaption">
<div   class="handle"   handlefor="my"   style="background:activecaption;color:window"   title="移动按钮">移动按钮</div>
<input   type="button"   value="添加文字"   οnclick="txtInput.style.display='block'">
<input   type="text"   title="回车添加
ESC取消"   id="txtInput"     style="display:none"   οnkeypress="keypress()"
>
</div>
</body>
</html>

如锋

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
移动按钮

http://schemas.microsoft.com/intellisense/ie5"> /////////////////////////////////////////////////////////////////////// // This script was de
复制链接

扫一扫