php 页面拖动改变大小,拖动改变大小的实现

拖拽改变大小

div{

background:#CCC;

height:50px;

width:100px;

cursor:move;

}

$(function(){

bindResize(document.getElementById("test"));

});

function bindResize(el){

var els = el.style,

x = y =0;

$(el).mousedown(function(e) {

x = e.clientX - el.offsetWidth,

y = e.clientY - el.offsetHeight;

el.setCapture ? (

el.setCapture(),

el.onmousemove = function(ev){

mouseMove(ev || event)

},

el.onmouseup = mouseUp

) : (

$(document).bind("mousemove",mouseMove).bind("mouseup",mouseUp)

)

e.preventDefault();

});

function mouseMove(e){

els.width = e.clientX - x + 'px';

els.height = e.clientY - y + 'px';

}

function mouseUp(){

el.releaseCapture ? (

el.releaseCapture(),

el.onmousemove = el.onmouseup = null

) : (

$(document).unbind("mousemove",mouseMove).unbind("mouseup",mouseUp)

)

}

}

Please Drag it!