본문 바로가기

개발이야기/Javascript

마우스 스크롤 이동

let controlDown = false;
$.fn.scrollMove = function () {
	let controlDown = false;
	let pointer = {
		pageY : 0,
		pageX : 0,
		scrollTop : 0,
		scrollLeft : 0,
	};
	// 마우스 이벤트
	$(this).on('mousedown',function(e){
		e.preventDefault();
		controlDown = true;
		pointer.pageX = e.pageX;
		pointer.pageY = e.pageY;
		pointer.scrollTop = $(this).scrollTop();
		pointer.scrollLeft = $(this).scrollLeft();
	});
	$(this).on('mousemove',function(e){
		if(controlDown){
			let newPageX = e.pageX;
			let newPageY = e.pageY;
			$(this).scrollLeft(pointer.scrollLeft - newPageX + pointer.pageX);
			$(this).scrollTop(pointer.scrollTop - newPageY + pointer.pageY);
		}
	});
	$(this).on('mouseup',function(e){controlDown = false;});    
};	

$('스크롤영역').scrollMove();

$(document).mouseup(function (e){
	controlDown = false;
});