本文的示例说明了jQuery实现div层褪色和拖动的方法,供大家参考,具体实现方法如下:
复制代码代码如下所示:
jQuery实现了div层的淡入淡出效果。
#格式
{
位置:绝对;
宽度:400px;
身高:300px;
边境:1px solid # 333333;
背景颜色:# 777788;
文本对齐:中心;
线高度:400%;
字体大小:13px;
左:80px;
Top:20px;
}
无功_move = false; / /移动标签
无功_x,_y; / /鼠标从控件的左上角的相对位置
$(文档)Ready(函数(){)
$(# DIV2)。Click(function(){)
警报();单击释放触发器
})。Mousedown(function(e){ {)
_move =真;
_x = e.pagex-parseint($(# DIV2)。Css(左));
_y = e.pagey-parseint($(# DIV2)。Css(顶));
$(# DIV2 ),FadeTo(20,0.25); / /单击拖动透明显示
});
$(document)。Mousemove(function(e){
如果(_move){
var x = e.pagex-_x; / /移动根据对控件的左上角的绝对位置,鼠标的位置计算
var y = e.pagey-_y;
$(# DIV2)。Css({:Y,左:x }); / /位置控制
}
})。Mouseup(function(){)
_move = false;
$(# DIV2)。FadeTo(快
});
});
如果您没有看到效果,请刷新此页。
支持拖放,如果你不能拖动,刷新这个页面
希望本文能对大家的jQuery程序设计有所帮助。