Effect Description: in combination with the existing CSS style, after loading the plug-in, the webpage elements can be dragged freely in the window, and the effect options of the original position translucent and drag translucent can be selected as needed. In addition, when there are multiple drag-and-drop elements on the page, you can load another plug-in for setting the z-index to simulate the Windows window click pin effect.
Demo address: http://frontendcode.sinaapp.com/J-Lui/jQuery-jLdraggable-plugin/
Js/jquery. jLdraggable. js:
;("jLzindex" : (){ $dragIndex = $( arrzIndex = ( i=0; i < $dragIndex.length; i++){ zIdxNum = 10000 - i - i -2= {"getId":"drag" + ($dragIndex.length - i),"zIdx""#drag" + ($dragIndex.length - i)).css("z-index" i = 0 dIndex = 0(arrzIndex[i]){ (arrzIndex[i].getId == $().attr("id")){ dIndex =++( i = dIndex; i >=0; i--){ (i > 0= arrzIndex[i-1"#" + arrzIndex[i].getId).css("z-index"= $().attr("id""#" + arrzIndex[i].getId).css("z-index""jLdraggable" : (mod){ model = draggable = $drag = $(".dragBar").mousedown(= mouseLeft = e.pageX - $drag.find(".dragBar").offset().left; mouseTop = e.pageY - $drag.find(".dragBar").offset().top; (model == "cFade"){ $drag.clone().appendTo("body").addClass("dragShadow").fadeTo(0,0.2).css("z-index",parseInt($drag.css("z-index")) - 1 (model == "dFade"){ $drag.clone().appendTo("body").addClass("dragShadow").css("z-index",parseInt($drag.css("z-index")) - 10,0.2 winWidth = winHeight = dragLeft = e.pageX - dragTop = e.pageY - (dragLeft < 0){dragLeft = 0(dragLeft + $drag.width() >= winWidth -(dragTop < 0){dragTop = 0(dragTop + $drag.height() >= winHeight -"left",dragLeft + "px""top",dragTop + "px" = ".dragShadow"(model == "dFade"0,1
Index.html:
$ (}); No parameter in-situ translucent drag translucent