resizeDiv是要拖拽的div的id; iframeDiv是同步移动的div的id $(function(){ //是否移动 var mFlag=false; //鼠标与div左上角相对位置 var divX,divY; var oLeft=parseInt($("#resizeDiv").css("left")); var oTop=parseInt($("#resizeDiv").css("top")); var iframeWidth = parseInt($("#iframeDiv").css("width")); var iframeHeight = parseInt($("#iframeDiv").css("height")); $("#resizeBtn").bind("click mousedown", function(e){ if (event.type == 'click') { }else if(event.type == 'mousedown') { mFlag=true; divX =e.pageX - parseInt($("#resizeDiv").css("left")); divY =e.pageY - parseInt($("#resizeDiv").css("top")); } }); $(document).mousemove(function(e){ if(mFlag){ //画出新坐标 $("#resizeDiv").css({top:e.pageY-divY,left:e.pageX-divX}); $("#iframeDiv").css("width", iframeWidth+parseInt($("#resizeDiv").css("left"))-oLeft + "px"); $("#iframeDiv").css("height", iframeHeight+parseInt($("#resizeDiv").css("top"))-oTop+ "px"); $("#iframeDiv").css("position","absolute"); } }).mouseup(function(){ mFlag=false; }); })
div鼠标拖拽移动,并且同步移动其它组件
最新推荐文章于 2023-11-30 08:39:27 发布