当前位置:编程学习 > JS >>

jquery div层拖动效果

jquery div层拖动效果
$(function(){
var _move=false;//移动标记
var _x,_y;//鼠标离控件左上角的相对位置
$(".drag").mousedown(function(e){
_move=true;
_x=e.pagex-parseint($(".drag").css教程("left"));
_y=e.pagey-parseint($(".drag").css("top"));
$(".drag").fadeto(20, 0.5);//点击后开始拖动并透明显示
});
$(document).mousemove(function(e){
if(_move){
var x=e.pagex-_x;//移动时根据鼠标位置计算控件左上角的绝对位置
var y=e.pagey-_y;
$(".drag").css({top:y,left:x});//控件新位置
}
}).mouseup(function(){
_move=false;
$(".drag").fadeto("fast", 1);//松开鼠标后停止移动并恢复成不透明
});
});
补充:网页制作,jquery 
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,