<script>
function beginDrag(elementToDrag,event)
{
//计算元素原左上角与鼠标的距离
//moveHandler要这值
var delatX=event.clientX-parseInt(elementToDrag.style.left);
// 只水平移动,关闭垂直.
// var delatY=event.clientY-parseInt(elementToDrag.style.top);
//注册响应mousemove和mousedown事件后的mouseup事件的处理程序
if(document.addEventListener) { //2级DOM事件模型
//注册捕捉事件处理程序。
document.addEventListener("mousemove",moveHandler,true);
document.addEventListener("mouseup",upHandler,true);
}
else if(document.attachEvent) { //IE5+ 的事件模型
//在IE事件模型中,我们不能捕捉事件,所以只有当事件起泡到这些处理程序时,
//它们才被触发. 假设不存在干涉元素, 处理了事件后它们就停止传播
document.attachEvent("onmousemove",moveHandler);
document.attachEvent("onmouseup",upHandler);
}
else { //IE4事件模型
//IE4我们不能使用attachEvent方法,所以存储了以前赋予的处理
//程序后,直接赋予新的事件处理程序,这样可以恢复旧的处理程序.
//注意,这样依赖于事件起泡.
var oldmovehandler=document.onmousemove;
var olduphandler=document.onmouseup;
document.onmousemove=moveHandler;
document.onmouseup=upHandler;
}
//我们处理了该事件,不要再让其他元素看见.
if(event.stopPropagation) event.stopPropagation(); //2 级DOM
else event.cancelBubble=true; //IE
//下面禁止执行默认动作
if(event.preventDefault) event.preventDefault(); //2级DOM
else event.returnValue=false; //IE
/* 这是元素被拖动时捕捉mousemove事件的处理程序.
* 它负责移动元素
*/function moveHandler(e)
{
if(!e) e=window.event; //IE事件模型;
//把元素移动到鼠标当前的位置,根据初始鼠标点击的偏移量进行调整
if(e.clientX-delatX<300 && e.clientX-delatX>0) //e.clientX-startelement.style.left;
elementToDrag.style.left=(e.clientX-delatX)+"px";
// 只水平移动 elementToDrag.style.top=(e.clientY-delatY)+"px";
else if(e.clientX-delatX<0) //滑动条不能小于0px
elementToDrag.style.left=0+"px";
else //滑动条不能大于300px
elementToDrag.style.left=300+"px";
//不要再让其他元素看到该事件.
if(e.stopPropagation) e.stopPropagation(); //2级DOM
else e.cancelBubble=true; //IE
}
/* 这是捕捉拖移结束最后发生的mouseup事件的处理程序.
*/
function upHandler(e)
{
if(!e) e=window.event; //IE事件模型.
//注销捕捉事件程序.
if(document.removeEventListener) { //DOM事件模型
document.removeEventListener("mouseup",upHandler,true);
document.removeEventListener("mousemove",moveHandler,true);
}
else if(document.detachEvent) { //IE5+ 事件模型
document.detachEvent("onmouseup",upHandler);
document.detachEvent("onmousemove",moveHandler);
}
else { //IE事件模型
document.onmouseup=olduphandler;
document.onousemove=oldmovehandler;
}
//不要再让事件进一步传播.
if(e.stopPropagation) e.stopPropagation(); //2级DOM
else e.cancelBubble=true; //IE
} }</script>
<input type="image" src="slider.gif" width="29" height="10"
style="position:absolute;left:0px;top:0px;"
onmousedown="beginDrag(this,event);"><div style="position:absolute; left:100px;top:100px;
backgroud-color:white;border:solid back;">
<div style="backgroud-color:gray;border-bottom:dotted black;
padding:3px;font-family:sans-serif;font-weight:bold;"
onmousedown="beginDrag(this.parentNode,event);"
ondblclick="alert('改成你需要的.')">
Drag Me
</div>
<p>This is a test. Testing....</p>
function beginDrag(elementToDrag,event)
{
//计算元素原左上角与鼠标的距离
//moveHandler要这值
var delatX=event.clientX-parseInt(elementToDrag.style.left);
// 只水平移动,关闭垂直.
// var delatY=event.clientY-parseInt(elementToDrag.style.top);
//注册响应mousemove和mousedown事件后的mouseup事件的处理程序
if(document.addEventListener) { //2级DOM事件模型
//注册捕捉事件处理程序。
document.addEventListener("mousemove",moveHandler,true);
document.addEventListener("mouseup",upHandler,true);
}
else if(document.attachEvent) { //IE5+ 的事件模型
//在IE事件模型中,我们不能捕捉事件,所以只有当事件起泡到这些处理程序时,
//它们才被触发. 假设不存在干涉元素, 处理了事件后它们就停止传播
document.attachEvent("onmousemove",moveHandler);
document.attachEvent("onmouseup",upHandler);
}
else { //IE4事件模型
//IE4我们不能使用attachEvent方法,所以存储了以前赋予的处理
//程序后,直接赋予新的事件处理程序,这样可以恢复旧的处理程序.
//注意,这样依赖于事件起泡.
var oldmovehandler=document.onmousemove;
var olduphandler=document.onmouseup;
document.onmousemove=moveHandler;
document.onmouseup=upHandler;
}
//我们处理了该事件,不要再让其他元素看见.
if(event.stopPropagation) event.stopPropagation(); //2 级DOM
else event.cancelBubble=true; //IE
//下面禁止执行默认动作
if(event.preventDefault) event.preventDefault(); //2级DOM
else event.returnValue=false; //IE
/* 这是元素被拖动时捕捉mousemove事件的处理程序.
* 它负责移动元素
*/function moveHandler(e)
{
if(!e) e=window.event; //IE事件模型;
//把元素移动到鼠标当前的位置,根据初始鼠标点击的偏移量进行调整
if(e.clientX-delatX<300 && e.clientX-delatX>0) //e.clientX-startelement.style.left;
elementToDrag.style.left=(e.clientX-delatX)+"px";
// 只水平移动 elementToDrag.style.top=(e.clientY-delatY)+"px";
else if(e.clientX-delatX<0) //滑动条不能小于0px
elementToDrag.style.left=0+"px";
else //滑动条不能大于300px
elementToDrag.style.left=300+"px";
//不要再让其他元素看到该事件.
if(e.stopPropagation) e.stopPropagation(); //2级DOM
else e.cancelBubble=true; //IE
}
/* 这是捕捉拖移结束最后发生的mouseup事件的处理程序.
*/
function upHandler(e)
{
if(!e) e=window.event; //IE事件模型.
//注销捕捉事件程序.
if(document.removeEventListener) { //DOM事件模型
document.removeEventListener("mouseup",upHandler,true);
document.removeEventListener("mousemove",moveHandler,true);
}
else if(document.detachEvent) { //IE5+ 事件模型
document.detachEvent("onmouseup",upHandler);
document.detachEvent("onmousemove",moveHandler);
}
else { //IE事件模型
document.onmouseup=olduphandler;
document.onousemove=oldmovehandler;
}
//不要再让事件进一步传播.
if(e.stopPropagation) e.stopPropagation(); //2级DOM
else e.cancelBubble=true; //IE
} }</script>
<input type="image" src="slider.gif" width="29" height="10"
style="position:absolute;left:0px;top:0px;"
onmousedown="beginDrag(this,event);"><div style="position:absolute; left:100px;top:100px;
backgroud-color:white;border:solid back;">
<div style="backgroud-color:gray;border-bottom:dotted black;
padding:3px;font-family:sans-serif;font-weight:bold;"
onmousedown="beginDrag(this.parentNode,event);"
ondblclick="alert('改成你需要的.')">
Drag Me
</div>
<p>This is a test. Testing....</p>
<head>
<title> test </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script language="JavaScript">
<!--
var ms=0;
function did(obj){
ms=obj;
event.srcElement.setCapture();
x=document.all(ms).style.pixelLeft-event.x;
y=document.all(ms).style.pixelTop-event.y;
}function document.onmousemove(){
if(ms){
document.all(ms).style.pixelLeft=x+event.x;
document.all(ms).style.pixelTop=y+event.y;
}
}function document.onmouseup(){
if(ms){
event.srcElement.releaseCapture();
ms=0;
}
}
//-->
</script>
</head><body>
<div style="position:absolute;width:100;height:100;background-color:red" onmousedown="did(this.uniqueID)"></div>
<div style="position:absolute;width:100;height:100;background-color:red" onmousedown="did(this.uniqueID)"></div>
</body>
</html>
你们把我的意思搞错了
你们看看我的代码
可能会了解我的意思
<html>
<head>
<title>test</title>
</head><script language="javascript">
function mov()
{
if (anil.style.pixelTop<600)
{
anil.style.pixelTop+=2;
anil.style.pixelLeft+=2;
setTimeout("mov()",50);
}
if (anil.style.pixelTop==600)
{
anil.style.pixelTop-=2;
anil.style.pixelLeft+=2;
setTimeout("mov()",50);
}
}
</script>
<body onLoad="mov()">
<div id="anil" style="position:absolute;left:10;top:10">
<img src="../../../Inetpub/%CE%B4%C3%FC%C3%FB%D5%BE%B5%E3%201/image1.gif">
</div> </body>
</html>
你们可以运行一下我的代码
看看我的要求
谢谢各位
急急!!!!1