请解释一些javascricpt代码

-2

这是一个浮动窗口的例子。我知道，点击鼠标拖动文件功能被称为。请解释两个div的用途，以及drag函数使用的拖拽函数和movehandler。请解释这些功能的确切功能，以及这些功能中的e和px符号是什么？请解释一些javascricpt代码

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250"> 
<title>Floating Window</title> 
<script src="Drag.js"></script> 
</head> 
<body> 

<div id="window" style="position:absolute; z-index:10; left:350px; top:160px; width:400px;background-color:#dde3eb; border:1px solid #464f5a;"> 

    <div style="padding-bottom:8px; width:400px; background-color:#718191; border-bottom:1px solid #464f5a;" onMouseDown="beginDrag(this.parentNode, event);"> 

     <div style="position:absolute; top:2px; left:5px; font-size:16px; font-weight:bold; color:#FFFFFF;">Drag me!</div> 

     <div style="position:absolute; top:3px; left:377px; float:right;" onClick="this.parentNode.parentNode.style.display = 'none"> 



     </div> 

    </div> 
<br/> 
    <div style="margin-left:20px;">your content here...</div> 

    <div style="margin-left:30px;">your content here...</div> 

    <div style="margin-left:40px;">your content here...</div> 
<br/> 

</div> 



</body> 

function beginDrag(elementToDrag, event){ 
    var deltaX = event.clientX - parseInt(elementToDrag.style.left); 
    var deltaY = event.clientY - parseInt(elementToDrag.style.top); 
    if (document.addEventListener){ 
     document.addEventListener("mousemove", moveHandler, true); 
     document.addEventListener("mouseup", upHandler, true); 
    } 
    else if (document.attachEvent){ 
     document.attachEvent("onmousemove", moveHandler); 
     document.attachEvent("onmouseup", upHandler); 
    } 
    else { 
     var oldmovehandler = document.onmousemove; 
     var olduphandler = document.onmouseup; 
     document.onmousemove = moveHandler; 
     document.onmouseup = upHandler; 
    } 
    if (event.stopPropagation) event.stopPropagation(); 
    else event.cancelBubble = true; 
    if (event.preventDefault) event.preventDefault(); 
    else event.returnValue = false; 
    function moveHandler(e){ 
     if (!e) e = window.event; 
     elementToDrag.style.left = (e.clientX - deltaX) + "px"; 
     elementToDrag.style.top = (e.clientY - deltaY) + "px"; 
     if (e.stopPropagation) e.stopPropagation(); 
     else e.cancelBubble = true; 
    } 
    function upHandler(e){ 
     if (!e) e = window.event; 
     if (document.removeEventListener){ 
      document.removeEventListener("mouseup", upHandler, true); 
      document.removeEventListener("mousemove", moveHandler, true); 
     } 
     else if (document.detachEvent){ 
      document.detachEvent("onmouseup", upHandler); 
      document.detachEvent("onmousemove", moveHandler); 
     } 
     else { 
      document.onmouseup = olduphandler; 
      document.onmousemove = oldmovehandler; 
     } 
     if (e.stopPropagation) e.stopPropagation(); 
     else e.cancelBubble = true; 
    } 
}

来源

2011-02-13 mubeen

`e`是触发事件的对象。 `“px”`用于像素。但是，如果你不知道这一点，那么你肯定会对这个代码不了解。也许有时间阅读一本书？之后，你可以问一个更具体的问题，而不是在这里粘贴一个网站，问问什么是问题。 :) – GolezTrol 2011-02-13 13:38:47

我是新来的JavaScript，但已经做了很多其他的编程语言，所以请不要抨击我，如果我去稍有不妥

2的div：它仅仅是HTML元素之一，它是用来区分你目前正在

uphandler其中HTML的一部分：是您已在HTML身下宣布自定义功能，我不太清楚有什么功能不

和'moveHandler'函数一样，从外观上看它的moveHandler功能作出修改什么款式什么的

希望这会帮助

来源

2011-02-13 13:57:10

请解释一些javascricpt代码

回答

相关问题