我该如何做到这一点,以便我可以将鼠标放在页面的正文上,然后向上或向下拖动页面,就像在 PDF 中一样?
基本上我希望能够上下拖动整个页面,知道如何做到这一点吗?我不想使用 jQuery UI 来做任何事。
好吧,这是阶段...
1)您需要在文档正文上有一个持续监听器,以监视当前鼠标位置
2) 按下鼠标时,您需要滚动大致等于鼠标移动的速度(您可以选择滚动得稍快一些)
这是在 jQuery 中执行此操作的示例
var gesturesX = 0;
var gesturesY = 0;
var startPosition = 0;
var velocity = 0;
var isMouseDown = false;
var timer;
function GetVelocity() {
velocity = startPosition - gesturesY;
}
$(document).mousemove( function (e) {
gesturesX = parseInt(e.pageX, 10);
gesturesY = parseInt(e.pageY, 10);
$("#mouse").html(gesturesY);
if (isMouseDown) {
window.scrollBy(0, startPosition - gesturesY);
return false;
}
});
$(document).mousedown( function() {
startPosition = gesturesY;
isMouseDown = true;
timer = window.setTimeout(GetVelocity, 50);
});
$(document).mouseup( function() {
isMouseDown = false;
if (velocity != 0) {
$Body = $("body");
var distance = velocity * 20;
var scrollToPosition = $Body.scrollTop() + distance;
$Body.eq(0).animate({ scrollTop: scrollToPosition}, 1000);
velocity = 0;
}
return false;
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)