好久没写过js的东西了..从前一段时间痴迷过后,最近有见识到了ext的强大,不过嘛,写一些简单的,基础的实现还是自己来好了..不过ext确实很强大,没看过的人试试把~呵呵~
这是一个带动画效果的弹出的层,然后关闭也加入了动画的效果,然后使层具有被拖动的功能.动画效果其实就是用了4个偏移量left,top,x,y和定时器实现的.拖动嘛,是注册带document的mousemove的事件实现的.
先看看拖动的代码..
canBeDrag.prototype={
initialize:function(sender)
{
sender.onmousedown=function()
{
var backDiv=this.backDiv;
var offsetX=event.clientX-sender.offsetLeft;
var offsetY=event.clientY-sender.offsetTop;
document.body.onmousemove=function()
{
sender.style.left=event.x-offsetX;
sender.style.top=event.y-offsetY;
}
}
sender.onmouseup=function()
{
document.body.onmousemove=null;
document.body.onmouseup=function()
{
document.body.onmousemove=null;
}
}
}
}
然后要让这个层可以拖动注册
var sender1=$("dragDiv1");
var sender2=$("dragDiv2");
var sender3=$("dragDiv3");
var drag1=new canBeDrag(sender1);
var drag2=new canBeDrag(sender2);
var drag3=new canBeDrag(sender3);就可以了
恩,因为用了prototype来定义的类,所以就不全帖出来了..有兴趣的直接下载下去看看把~呵呵.
例子下载
posted on 2008-01-06 18:33
zhuibobo 阅读(747)
评论(9) 编辑 收藏 网摘