简易实现JS拖拽构图:
提供两个js函数,调用run()函数即可实现效果:
/** * String targetId 第一个参数为目标容器的id属性值 * String componentClass 第二个参数为拖拽组件的class属性值 */ function run(targetId,componentClass){ var component = document.getElementsByClassName(componentClass); for(var c in component){ if(isNaN(c)){ continue; } drag(component[c],document.getElementById(targetId)); } } function drag(component,target){ component.onmousedown = function(e){ var diffW = e.clientX - this.offsetLeft , diffH = e.clientY - this.offsetTop; var clo = document.createElement('div'); clo = this.cloneNode(true); clo.style.filter = "alpha(opacity=30)"; clo.style.opacity = 0.3; clo.style.float = "left"; clo.style.position = "absolute"; clo.style.top = this.offsetTop +'px'; clo.style.left = this.offse