一、不使用jquery，简单的缩放：
$("#imgMain").css({ left: newLeft + "px", top: newTop + "px" });
$("#imgMain").width(newWidth);
$("#imgMain").height(newHeight);
}
);
$("#divBlock").bind("mousedown", function (e) {
var xo = e.pageX;
var yo = e.pageY;
var imgLeft = $("#imgMain").position().left;
var imgTop = $("#imgMain").position().top;
var overHeight = $("#divBlock").height();
$("#divBlock").bind("mousemove", function (e) {
window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
var x = e.pageX;
var y = e.pageY;
var bX = $("#imgBox").offset().left;
var bY = $("#imgBox").offset().top;
$("#imgMain").css("left", x - bX - (xo - bX) + imgLeft);
$("#imgMain").css("top", y - bY - (yo - bY) - overHeight + imgTop);
});
});
$("#divBlock").bind("mouseup mouseout", function () {
$("#divBlock").unbind("mousemove");
});
});
</script>
</head>
<body>
<div id="imgBox">
<div style="width: 200px; height: 200px; cursor: pointer; position: relative; left: 0;
top: 0; filter: alpha(opacity=0); opacity: 0; -moz-opacity: 0; background: blue;
z-index: 999;" id="divBlock">
</div>
<img src="test.jpg" width="200" height="200" alt="" id="imgMain" />
</div>
</body>
</html>