티스토리 뷰
<head> 와 </head> 사이에 아래의 스크립트 코드를 삽입합니다.
다음으로 <body> 와 </body> 사이에 아래와 같이 div 로 감싸보세요. 꼭 전체를 감싸지 않아도 될겁니다.
<div id=wrapper onmousedown="mousePosition(event)" >
내용
</div>
<script type="text/javascript">
var ContextMenu = 1;
document.oncontextmenu = MenuOff
function MenuOff() {
if(ContextMenu == 0) {
ContextMenu = 1;
return false;
}
}
function goto_top()
{
var x = document.body.scrollLeft;
var y = document.body.scrollTop;
var step = 2;
while ((x != 0) || (y != 0)) {
scroll (x, y);
step += (step * step / 100);
x -= step;
y -= step;
if (x < 0) x = 0;
if (y < 0) y = 0;
}
scroll (0, 0);
ContextMenu = 0;
}
function goto_bottom()
{
var x = document.body.scrollLeft;
var y = document.body.scrollTop;
var DocWidth = document.body.scrollWidth;
var DocHeight = document.body.scrollHeight;
var step = 2;
while ((x != DocWidth) || (y != DocHeight)) {
scroll (x, y);
step += (step * step / 100);
x += step;
y += step;
if (x > DocWidth) x = DocWidth;
if (y > DocHeight) y = DocHeight;
}
scroll (x, y);
ContextMenu = 0;
}
function addEvent(elm, evType, fn, useCapture)
{
if (elm.addEventListener) {
elm.addEventListener(evType, fn, useCapture);
return true;
} else if (elm.attachEvent) {
var r = elm.attachEvent('on' + evType, fn);
return r;
} else {
elm['on' + evType] = fn;
}
}
var start_x = 0;
var start_y = 0;
function mousePosition(evt) {
if (!evt) {
evt = arguments[0] ? arguments[0] : window.event;
}
if(evt.button == 2 ) {
if(evt) {
start_x = evt.pageX ? evt.pageX : evt.clientX;
start_y = evt.pageY ? evt.pageY : evt.clientY;
}else{
start_x= window.event.x;
start_y= window.event.y;
}
addEvent(document.getElementById("wrapper"), 'mouseup', mousePositionDiff, false);
}
}
function mousePositionDiff(evt) {
if (!evt) {
evt = arguments[0] ? arguments[0] : window.event;
}
if(evt.button == 2) {
var end_x,end_y;
var diff_x,diff_y;
if(evt) {
end_x = evt.pageX ? evt.pageX : evt.clientX;
end_y = evt.pageY ? evt.pageY : evt.clientY;
}else{
end_x=window.event.x;
end_y=window.event.y;
}
diff_x = start_x - end_x;
diff_y = start_y - end_y;
if(diff_y > 30) goto_top();
if(diff_y < -30) goto_bottom();
}
}
</script>
var ContextMenu = 1;
document.oncontextmenu = MenuOff
function MenuOff() {
if(ContextMenu == 0) {
ContextMenu = 1;
return false;
}
}
function goto_top()
{
var x = document.body.scrollLeft;
var y = document.body.scrollTop;
var step = 2;
while ((x != 0) || (y != 0)) {
scroll (x, y);
step += (step * step / 100);
x -= step;
y -= step;
if (x < 0) x = 0;
if (y < 0) y = 0;
}
scroll (0, 0);
ContextMenu = 0;
}
function goto_bottom()
{
var x = document.body.scrollLeft;
var y = document.body.scrollTop;
var DocWidth = document.body.scrollWidth;
var DocHeight = document.body.scrollHeight;
var step = 2;
while ((x != DocWidth) || (y != DocHeight)) {
scroll (x, y);
step += (step * step / 100);
x += step;
y += step;
if (x > DocWidth) x = DocWidth;
if (y > DocHeight) y = DocHeight;
}
scroll (x, y);
ContextMenu = 0;
}
function addEvent(elm, evType, fn, useCapture)
{
if (elm.addEventListener) {
elm.addEventListener(evType, fn, useCapture);
return true;
} else if (elm.attachEvent) {
var r = elm.attachEvent('on' + evType, fn);
return r;
} else {
elm['on' + evType] = fn;
}
}
var start_x = 0;
var start_y = 0;
function mousePosition(evt) {
if (!evt) {
evt = arguments[0] ? arguments[0] : window.event;
}
if(evt.button == 2 ) {
if(evt) {
start_x = evt.pageX ? evt.pageX : evt.clientX;
start_y = evt.pageY ? evt.pageY : evt.clientY;
}else{
start_x= window.event.x;
start_y= window.event.y;
}
addEvent(document.getElementById("wrapper"), 'mouseup', mousePositionDiff, false);
}
}
function mousePositionDiff(evt) {
if (!evt) {
evt = arguments[0] ? arguments[0] : window.event;
}
if(evt.button == 2) {
var end_x,end_y;
var diff_x,diff_y;
if(evt) {
end_x = evt.pageX ? evt.pageX : evt.clientX;
end_y = evt.pageY ? evt.pageY : evt.clientY;
}else{
end_x=window.event.x;
end_y=window.event.y;
}
diff_x = start_x - end_x;
diff_y = start_y - end_y;
if(diff_y > 30) goto_top();
if(diff_y < -30) goto_bottom();
}
}
</script>
다음으로 <body> 와 </body> 사이에 아래와 같이 div 로 감싸보세요. 꼭 전체를 감싸지 않아도 될겁니다.
<div id=wrapper onmousedown="mousePosition(event)" >
내용
</div>
'이전페이지/다음페이지' 로의 이동기능 추가
function goForward() {
window.history.go(1);
ContextMenu = 0;
}
function goBack() {
window.history.go(-1);
ContextMenu = 0;
}
기존 소스에 위의 함수를 두개 추가해 주신후..
if(diff_y > 30) goto_top();
if(diff_y < -30) goto_bottom();
를 찾아서 그 밑에 아래 내용을 붙여주면 됩니다.
if(diff_x > 30) goBack();
if(diff_x < -30) goForward();
function goForward() {
window.history.go(1);
ContextMenu = 0;
}
function goBack() {
window.history.go(-1);
ContextMenu = 0;
}
기존 소스에 위의 함수를 두개 추가해 주신후..
if(diff_y > 30) goto_top();
if(diff_y < -30) goto_bottom();
를 찾아서 그 밑에 아래 내용을 붙여주면 됩니다.
if(diff_x > 30) goBack();
if(diff_x < -30) goForward();
댓글