http://www.w3.org/1999/xhtml">
<頭>
<スクリプトタイプ="text/javascript">
$(関数() {
varmouseOffx = 0;
varmouseOffy = 0;
var isDrag = false;
$(".dragBox div:eq(0)").unbind(".click").on("mousedown", function (ev) {
MouseOffx = ev.clientX - $(".dragBox div:eq(0)").offset().left;
MouseOffy = ev.clientY - $(".dragBox div:eq(0)").offset().top;
isDrag = true;
})
$(document).unbind(".click").on("mousemove", function (ev) {
var mourseX = ev.clientX、mourseY = ev.clientY;
var moveX = 0、moveY = 0;
if (isDrag === true) {
moveX = mourseX -mouseOffx;
moveY = mourseY - マウスオフ;
var maxX = $(window).outerWidth(false) - $(".dragBox").outerWidth(false);
var maxY = $(window).outerHeight(false) - $(".dragBox").outerHeight(false);
moveX = Math.min(maxX, Math.max(0, moveX));
moveY = Math.min(maxY, Math.max(0, moveY));
$(".dragBox").css({ "left": moveX, "top": moveY });
}
});
$(document).unbind(".click").on("mouseup", function () {
isDrag = false;
});
});
テスト