c语言图片淡入,jQuery实现DIV层淡入淡出拖动特效的方法

本文实例讲述了jQuery实现DIV层淡入淡出拖动特效的方法。分享给大家供大家参考。具体实现方法如下：

jQuery实现DIV层淡入淡出的拖动效果)

#div2

{

position:absolute;

width:400px;

height:300px;

border:1px solid #333333;

background-color:#777788;

text-align:center;

line-height:400%;

font-size:13px;

left:80px;

top:20px;

}

var _move=false;//移动标记

var _x,_y;//鼠标离控件左上角的相对位置

$(document).ready(function(){

$("#div2").click(function(){

//alert("click");//点击(松开后触发)

}).mousedown(function(e){

_move=true;

_x=e.pageX-parseInt($("#div2").css("left"));

_y=e.pageY-parseInt($("#div2").css("top"));

$("#div2").fadeTo(20, 0.25);//点击后开始拖动并透明显示

});

$(document).mousemove(function(e){

if(_move){

var x=e.pageX-_x;//移动时根据鼠标位置计算控件左上角的绝对位置

var y=e.pageY-_y;

$("#div2").css({top:y,left:x});//控件新位置

}

}).mouseup(function(){

_move=false;

$("#div2").fadeTo("fast", 1);//松开鼠标后停止移动并恢复成不透明

});

});

看不到效果，请刷新一下本页面。

支持拖拽
如果不能拖动，请刷新本页面

希望本文所述对大家的jQuery程序设计有所帮助。