我正在尝试设计一个自定义滚动条，我只能在鼠标移动缓慢的情况下才能这样做。如果鼠标移动速度很快，那么＆＃39; bar＆＃39;离开滚动区域。 这是我的小提琴： http://jsfiddle.net/ghufranne/ydz2hpm0/22/
var $body = $('body');
var $target = null;
var isDraggEnabled = false;
var posY=0;
$body.on("mousedown", "#bar", function(e) {
$this = $(this);
if(e.offsetX==undefined){
y = e.pageY-$(this).offset().top;
}else{
y = e.offsetY;
};
$('#scrollRegion').offset({
top:currTop+y});
$target = $(e.target);
e.preventDefault();
});
$body.on("mouseup", function(e) {
$target = null;
});
var bottomScrollLock=false;
var topScrollLock=false;
$body.find("#scroll").on("mousemove", function(e) {
if ($target) {
var pos= $target.offset();
if(bottomScrollLock && e.pageY<posY){
bottomScrollLock=false;
}
if(topScrollLock && e.pageY>posY){
topScrollLock=false;
}
if(pos.top<scrollPos.top )
{
posY=e.pageY;
topScrollLock=true;
}
if((pos.top+heightOfBar-scrollHeight)> scrollPos.top){
posY=e.pageY;
bottomScrollLock=true;
}
noOfElToScroll = parseInt(pos.top-e.pageY+y);
$("#drag").text(noOfElToScroll);
if(!bottomScrollLock && noOfElToScroll<0 ){
$target.offset({
top: e.pageY -y
});
for(var i=0;i<1;i++){
$drop.find('li:last').after("<li>value "+(lastVisible++)+"</li>");
$drop.find('li:first').remove();
firstVisible++;}
}
if(noOfElToScroll>0 &&!topScrollLock){
$target.offset({
top: e.pageY -y
});
$("#drag").text($('#bar').offset().top);
$drop.find('li:first').before("<li>value "+(firstVisible--)+"</li>");
$drop('li:last').remove();
lastVisible--;
}
};
});
如果我使用了Draggable工作，它会正常工作。 但我不想使用它，我想学习它。