jquery实现div移动(转帖)

1.jquery.move.js

(function($){

$.fn.jquerymove = function(){

var moveobj = $(this);

var old_position = {};

var new_position = {};

var offset = {};

var isover = 1;

var offset_fake = {};

 

moveobj.css({position: "absolute",cursor: "move" });

moveobj.mousedown(

function (e) {

old_position = {X:e.clientX,Y:e.clientY};

offset = moveobj.offset();

isover = 0;

$('body').append('

');

$('#_moveobj').css({

width: moveobj.width() - 50,

height: moveobj.height()-100,

left: offset.left,

top: offset.top - 20,

cursor: 'move',

position: 'absolute',

display: 'none',

zIndex: '10000',

border: '1px solid red'

});

$('#_moveobj').mouseup(

function (e) {

isover = 1;

$('#_moveobj').css({display: 'none'});

$('#_moveobj').remove();

}

);

$('#_moveobj').css({display: 'block'});

offset_fake = $('#_moveobj').offset();


}

);

 

$('body').mousemove(

function (e) {

if (!isover) {

 

new_position = {X:e.clientX,Y:e.clientY};

$('#_moveobj').css({

left: offset_fake.left+new_position.X-old_position.X,

top: offset_fake.top+new_position.Y-old_position.Y

})

moveobj.css({

left: offset.left+new_position.X-old_position.X,

top: offset.top+new_position.Y-old_position.Y

})

}

}

);

}


})(jQuery);

2.query.move.html

jquery

 


转帖地址:http://bbs2.chinaunix.net/viewthread.php?tid=1309400

代码很容易就能看懂,按照自己的需求修改一下jquery.move.js里的函数,源文件在上面的地址下载就可以

你可能感兴趣的:(js学习)