jQuery拖动图片删除示例

复制代码代码如下： head title/title style type=' text/CSS ' # mydiv { width : 900 px；背景色： # 444;绝对位置：左侧： 100像素} img {宽度： 200像素高度： 200像素；} ul { list-style-type : no；高度： 200像素；} ul Li { display : inline }/style script src=' http : js/Jquery 1。7 .js ' type=' text/JavaScript '/script script src=' http : js/jquery。ui。核心。js ' type=' text/JavaScript '/script script src=' http : js/jquery。ui。小部件。js ' type=' text/JavaScript '/script script src=' http 3360 js/jquery '存储的是被拖动的图片的初始坐标var起始左=0；var starttop=0；$('img ').可拖动({ start: function () { //为两个变量设置被拖动图片的初始坐标startleft=$(this).偏移量()。向左；starttop=$(this).偏移量()。顶部；}，stop:函数(){ if($(this)} .偏移量()。左$('#mydiv ').偏移量()。左$('#mydiv ').width() || $(this).偏移量()。top $('#mydiv ').偏移量()。top $('#mydiv ').高度()){ $(这个).移除();} else { //复位$(这个)。offset({ left: startleft，top : start top })})；})/脚本/标题/正文div id=' mydiv ' ul Li img src=' http : images/img 2。jpg '/Li Li img src=' http : images/img 3。jpg '/Li Li img src=' http : images/img 4。jpg '/Li Li img src=' http : images/img 5。jpg '/Li/ul/div/正文效果图