// This JavaScript Scroller code provided by http://www.ghtml.com // "Keep these two lines and you're free to use this code" // Scroller and Scrollbar preferrences listed here var upH = 18; // Up-Arrow Height var upW = 18; // Up-Arrow Width var downH = 18; // Down-Arrow Height var downW = 18; // Down-Arrow Width var dragH = 50; // Scrollbar Length var dragW = 50; // Scrollbar Width var scrollH = 390; // Scrollbar Height var speed = 3; // Scrolling Speed // Browser Detections var dom = document.getElementById ? true:false; var nn4 = document.layers ? true:false; var ie4 = document.all ? true:false; var mouseY; var mouseX; var clickUp = false; var clickDown = false; var clickDrag = false; var clickAbove = false; var clickBelow = false; var timer = setTimeout("",500); var upL; var upT; var downL; var downT; var dragL; var dragT; var rulerL; var rulerT; var contentT; var contentH; var contentClipH; var scrollLength; var startY; // MouseDown Functions function down(e){ if((document.layers && e.which!=1) || (document.all && event.button!=1)) return true; getMouse(e); startY = (mouseY - dragT); if(mouseX >= upL && (mouseX <= (upL + upW)) && mouseY >= upT && (mouseY <= (upT + upH))){ clickUp = true; return scrollUp(); } else if(mouseX >= downL && (mouseX <= (downL + downW)) && mouseY >= downT && (mouseY <= (downT + downH))){ clickDown = true; return scrollDown(); } else if(mouseX >= dragL && (mouseX <= (dragL + dragW)) && mouseY >= dragT && (mouseY <= (dragT + dragH))){ clickDrag = true; return false; } else if(mouseX >= dragL && (mouseX <= (dragL + dragW)) && mouseY >= rulerT && (mouseY <= (rulerT + scrollH))){ if(mouseY < dragT){ clickAbove = true; clickUp = true; return scrollUp(); } else{ clickBelow = true; clickDown = true; return scrollDown(); } } else{ return true; } } // Scrollbar Dragger Functions function move(e){ if(clickDrag && contentH > contentClipH){ getMouse(e); dragT = (mouseY - startY); if(dragT < (rulerT)) dragT = rulerT; if(dragT > (rulerT + scrollH - dragH)) dragT = (rulerT + scrollH - dragH); contentT = ((dragT - rulerT)*(1/scrollLength)); contentT = eval('-' + contentT); moveTo(); if(ie4) return false; } } function up(){ clearTimeout(timer); clickUp = false; clickDown = false; clickDrag = false; clickAbove = false; clickBelow = false; return true; } function getT(){ if(ie4) contentT = document.all.scroll_content.style.pixelTop; else if(nn4) contentT = document.scroll_contentClip.document.content.top; else if(dom) contentT = parseInt(document.getElementById("scroll_content").style.top); } function getMouse(e){ if(ie4){ mouseY = event.clientY + document.body.scrollTop; mouseX = event.clientX + document.body.scrollLeft; } else if(nn4 || dom){ mouseY = e.pageY; mouseX = e.pageX; } } function moveTo(){ if(ie4){ document.all.scroll_content.style.top = contentT; document.all.scroll_ruler.style.top = dragT; document.all.scroll_drag.style.top = dragT; } else if(nn4){ document.scroll_contentClip.document.scroll_content.top = contentT; document.scroll_ruler.top = dragT; document.scroll_drag.top = dragT; } else if(dom){ document.getElementById("scroll_content").style.top = contentT + "px"; document.getElementById("scroll_drag").style.top = dragT + "px"; document.getElementById("scroll_ruler").style.top = dragT + "px"; } } // DIV Layer Up-Scrolling Functions function scrollUp(){ getT(); if(clickAbove){ if(dragT <= (mouseY-(dragH/2))) return up(); } if(clickUp){ if(contentT < 0){ dragT = dragT - (speed*scrollLength); if(dragT < (rulerT)) dragT = rulerT; contentT = contentT + speed; if(contentT > 0) contentT = 0; moveTo(); timer = setTimeout("scrollUp()",25); } } return false; } // DIV Layer Down-Scrolling Functions function scrollDown(){ getT(); if(clickBelow){ if(dragT >= (mouseY-(dragH/2))) return up(); } if(clickDown){ if(contentT > -(contentH - contentClipH)){ dragT = dragT + (speed*scrollLength); if(dragT > (rulerT + scrollH - dragH)) dragT = (rulerT + scrollH - dragH); contentT = contentT - speed; if(contentT < -(contentH - contentClipH)) contentT = -(contentH - contentClipH); moveTo(); timer = setTimeout("scrollDown()",25); } } return false; } // Upon Reload, Repositions the DIV Layers to Default function reloadPage(){ location.reload(); } // Preloading the Images function eventLoader(){ if(ie4){ upL = document.all.scroll_up.style.pixelLeft; upT = document.all.scroll_up.style.pixelTop; downL = document.all.scroll_down.style.pixelLeft; downT = document.all.scroll_down.style.pixelTop; dragL = document.all.scroll_drag.style.pixelLeft; dragT = document.all.scroll_drag.style.pixelTop; rulerT = document.all.scroll_ruler.style.pixelTop; contentH = parseInt(document.all.scroll_content.scrollHeight); contentClipH = parseInt(document.all.scroll_contentClip.style.height); } else if(nn4){ upL = document.scroll_up.left; upT = document.scroll_up.top; downL = document.scroll_down.left; downT = document.scroll_down.top; dragL = document.scroll_drag.left; dragT = document.scroll_drag.top; rulerT = document.scroll_ruler.top; contentH = document.scroll_contentClip.document.content.clip.bottom; contentClipH = document.scroll_contentClip.clip.bottom; } else if(dom){ upL = parseInt(document.getElementById("scroll_up").style.left); upT = parseInt(document.getElementById("scroll_up").style.top); downL = parseInt(document.getElementById("scroll_down").style.left); downT = parseInt(document.getElementById("scroll_down").style.top); dragL = parseInt(document.getElementById("scroll_drag").style.left); dragT = parseInt(document.getElementById("scroll_drag").style.top); rulerT = parseInt(document.getElementById("scroll_ruler").style.top); contentH = parseInt(document.getElementById("scroll_content").offsetHeight); contentClipH = parseInt(document.getElementById("scroll_contentClip").offsetHeight); document.getElementById("scroll_content").style.top = 0 + "px"; } scrollLength = ((scrollH-dragH)/(contentH-contentClipH)); if(nn4){ document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP); window.onresize = reloadPage; } document.onmousedown = down; document.onmousemove = move; document.onmouseup = up; }