jQuery拖动图片删除示例_jquery

复制代码如下代码：

标题>

#mydiv
{
宽度：900px；
背景颜色：#444；
位置：绝对；
左：100px；
}
img
{
宽度：200px；
高度：200px；
}
ul
{
列表样式类型：无；
高度：200px；
}
ul li
{
显示：内联；
}
风格>






$(function () {
//存储是被拖动的图片的灵魂坐标
var startleft = 0;
var starttop = 0;
$('img') .draggable({
start: function () {
//为两个控件设置被拖动图片的灵魂坐标
startleft = $(this).offset().left;
starttop = $(this).offset().top;
},
stop: function () {
if ($(this).offset().left > $('#mydiv') .offset().left $('#mydiv').width() || $(this).offset().top > $('#mydiv').offset().top $('#mydiv' ).height()) {
$(this).remove()}
else {
//重置
$(this).offset({
left: startleft,
top: starttop
})
}
}
})
;
头>

;

• 
  


• 
  


• 
  


• 
  

身体>


效果图