【www.gdgbn.com--jquery】

 
 
 
 <script type="text/网页特效" src="jquery1.3.1.js"></script>
 
  foidsajfd
 
 <script type="text/javascript">
  var global_mousedown=false;
  var box=$("");
  box.css({display:"none",position:"absolute",border:"1px dotted red"});
  box.appendto("body");
  var _x,_y;
  $("#d").mousedown(function(event){
   global_mousedown=true;
   var offset=$("#d").offset();
   _x=event.pagex-offset.left;
   _y=event.pagey-offset.top;
   box.width($(this).width());
   box.height($(this).height());
   box.css({left:event.pagex-_x,top:event.pagey-_y});
   box.show();
  });
  $(document).mousemove(function(event){
   if(global_mousedown){
    box.css({left:event.pagex-_x,top:event.pagey-_y});
   }
  }).mouseup(function(event){
   if(global_mousedown){
    $("#d").animate({left:box.offset().left,top:box.offset().top},1000);
    box.hide();
   }
   global_mousedown=false;
  });;
 </script>

实例代码二

把javascript拷贝到一个js文件里 把js文件导入到页面中 在head的script模块中加入 $("div").mydrag(); 去页面测试下呢 拖拖     jquery.extend({zindex : 100});jquery.fn.extend({mydrag : function(callback,func){   this.each(function(){    this.posrange = {minx:0,miny:0,maxx:(document.compatmode == "css1compat"?document.documentelement.clientwidth:document.body.clientwidth),maxy:(document.compatmode == "css1compat"?document.documentelement.clientheight:document.body.clientheight)};    this.onmousedown = function(e)    {       this.style.zindex = $.zindex++;       this.style.position = "absolute";       this.drag(e,callback,func);    }    this.drag = function(e,callback,func)    {        var element = this,ev = e || window.event;        ev.rscreenx = ev.screenx;        ev.rscreeny = ev.screeny;        var pos = $(this).offset();        element.dragconfig = {defaultx : parseint(pos.left,10),defaulty : parseint(pos.top,10),defaultw: parseint($(this).width(),10),defaulth : parseint($(this).height(),10)};        document.onmouseup = function()        {            element.drop();            callback && callback();        };        document.onmousemove = function(e)        {            var ev2 = e || window.event;            if($.browser.msie&& ev2.button!=1)            {                return (element.drop(),callback && callback());            }            var mx = element.dragconfig.defaultx + (ev2.screenx - ev.rscreenx),            my = element.dragconfig.defaulty + (ev2.screeny - ev.rscreeny),            pr = element.posrange,mw = element.dragconfig.defaultw,mh = element.dragconfig.defaulth;            with(element.style)            {                left = (mxpr.maxx?(pr.maxx-mw):mx)) + "px";                top = (mypr.maxy?(pr.maxy-mh):my)) + "px";            }            func && func();                                  return false;        };        document.onselectstart = function(){return false;};    }    this.drop = function()    {        document.onmousemove =

document.onselectstart = document.onmouseup = null;    }   })}})

代码三

function my_point(x, y) {
    this.x = x;
    this.y = y;
}

$("#drag").mousedown(function(event){
    $(this).css("cursor", "move");

    var start_mouse = new my_point(0, 0); // 鼠标起始位置
    var start_obj = new my_point(0, 0); // 被拖拽手柄的起始位置

            start_mouse.x = event.clientx;
            start_mouse.y = event.clienty;
            start_obj.x = parseint(obj.style.left);
            start_obj.y = parseint(obj.style.top);

$(this).mousemove(function(event){
            this.parentnode.parentnode.style.left = start_obj.x + event.clientx - start_mouse.x + "px";
            this.parentnode.parentnode.style.top = start_obj.y + event.clienty - start_mouse.y + "px";
return false;

});

$("#drag").mouseup(function(){

$(this).unbind("mousemove");

return false;

})

.mouseo教程ut(function(){

$(this).unbind("mousemove");

 

return false;

});

本文来源：http://www.gdgbn.com/wangyezhizuo/27458/