JQuery做出鼠标拖拽效果.docVIP

html head titleThe Drag Drop effect/title !-- import the JQuery Library -- script type=text/javascript src=jquery.js/script !-- function codes -- script type=text/javascript !-- body onload -- $(function(){ !-- to remenber the position where the pointer is -- var posX,posY; !-- is allowd the DIV which show the items you selected display -- var showFile=false; !-- to remenber the items name which you selected -- var fileName=; !-- when you make a mouse down on the left panal -- $(#sectionA).mousedown(function(){ showFile=true; fileName=; !-- get the files name that you already selected and remenber it -- $(#sectionA option:selected).each(function(i,item){ fileName+=$(item).text()+br/; }); }); !-- when you release the mouse on the destination -- $(#sectionB) .mouseup(function(){ var obj=$(this); !-- to move the items to the destination -- $(#sectionA :selected).each(function(i,item){ var content=option value=+$(item).attr(value)++$(item).text()+/option; obj.append(content); $(item).remove(); }); }) ; !-- when mouse move -- $(body) .mousemove(function(e){ if(showFile){ $(#showListContent) .css({display:block,left:e.pageX+5,top:e.pageY+5}) .html(fileName); ; } }) !-- when release mouse -- .mouseup(function(){ showFile=false; $(#showListContent) .css(display,none); }) ; }); /script !-- Author:Lovingshus Forever Date:2011-12-27 14:57 Remark:Actually,I want to finish this kind of effect long time ago~,but,I busy with my games~hehe ~ So I finish it today!This Effect makes you hava the effect like drag and drop!And I didnt finish it ideally,but I like JQuery ~really!So~Thanks for your watching! -- style type=text/css #showListContent{ position:absolute; background-color:lightBlue; border:none; fi