Here's some rough pseudo-code:
$('body').mousedown(function(ev) {
//move div to ev.pageX, ev.pageY
//store ev.pageX and ev.pageY in some variables
//define mousemove handler
mousemovehandler = function(ev) {
//inc or dec div width and height
//based on diff between saved pageX and pageY and
//ev.pageX and ev.pageY
}
//bind handler to $('body').mousemove
});
$('body').mouseup(function(ev) {
//unbind body mousemove handler
});
Depending on how far you take that, you may end up with something close to jQuery UI's mouse plugin:
<a href="http://dev.jquery.com/view/trunk/ui/current/ui.mouse.js">
http://dev.jquery.com/view/trunk/ui/current/ui.mouse.js</a>So you may want to simply use it instead. If you have any questions on going that route, ask on the jquery-ui list.
- Richard