//事件绑定function myAddEvent(obj, sEvent, fn){ if(obj.attachEvent) { obj.attachEvent('on'+sEvent, fn); } else { obj.addEventListener(sEvent, fn, false); }}//用id获取元素function getById(id){ return document.getElementById(id);};//自定义滚动条function definedScroll(oScroll,oController,oContain,oPassage){ function onMouseWheel(ev){ var oEvent = ev || event; var oB = true; oB = oEvent.wheelDelta?oEvent.wheelDelta<0:oEvent.detail>0; if(oB){ setTop(oController.offsetTop+10); } else{ setTop(oController.offsetTop-10) } if(oEvent.preventDefault) { oEvent.preventDefault(); } return false; }; myAddEvent(oScroll,'mousewheel',onMouseWheel); myAddEvent(oScroll,'DOMMouseScroll',onMouseWheel); myAddEvent(oContain,'mousewheel',onMouseWheel); myAddEvent(oContain,'DOMMouseScroll',onMouseWheel); oController.onmousedown = function(ev){ var oEvent = ev || event; var disY = oEvent.clientY - oController.offsetTop; document.onmousemove = function(ev){ var oEvent = ev || event; var t = oEvent.clientY - disY; setTop(t); }; document.onmouseup = function(){ document.onmousemove = null; document.onmouseup = null; }; }; function setTop(iTop){ if(iTop<0){ iTop = 0; } else if(iTop>oScroll.offsetHeight - oController.offsetHeight){ iTop = oScroll.offsetHeight - oController.offsetHeight; } oController.style.top = iTop + "px"; var scale = iTop/(oPassage.offsetHeight-oContain.offsetHeight); oPassage.style.top = -(oPassage.offsetHeight-oContain.offsetHeight)*scale + "px"; } };window.onload = function(ev){ var oScroll = getById("scroll"); var oController = getById("scroll_controler"); var oContain = getById("scroll_contain"); var oPassage = getById("scorll_passage"); definedScroll(oScroll,oController,oContain,oPassage);};
