<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js javascript禁止滚动条滚动事件</title> <script type="text/javascript" src="control_scroll.js" ></script></head><body><script> // 用于通过ID获取对象 function $(x) { return document.getElementById(x); }; //添加事件 var addEvent = (function () { if (document.addEventListener) { return function (el, type, fn, capture) { el.addEventListener(type, fn, capture); }; } else { return function (el, type, fn, capture) { el.attachEvent('on' + type, function () { return fn.call(el, window.event); }, capture); } } })(); //添加鼠标滚动轮事件 function addEventWheel(obj, fn ,useCapture){ var mousewheelevt=(/Firefox/i.test(navigator.userAgent))?"DOMMouseScroll": "mousewheel";//FF doesn't recognize mousewheel as of FF3.x addEvent(obj, mousewheelevt, handler, useCapture); //初始化处理回调函数 function handler(event) { var delta = 0; var event = window.event ||event ; var delta = event.detail ?-event.detail/3 : event.wheelDelta/120; if(event.preventDefault){ event.preventDefault(); }else{ event.returnValue = false; }//禁止默认事件 return fn.apply(obj, [event, delta]);//event事件对象 delta 滚动值 } }
window.onload = function() { // 创建换行，让body足够高 for (i = 0; i < 500; i++) { var x = document.createElement('div'); x.innerHTML = "换行<br/>"; document.body.appendChild(x); } //添加鼠标滚动轮事件 随着滚动而改变值 addEventWheel($("wrap"),function(e,delta){ $("he").innerHTML = parseInt($("he").innerHTML) + delta; },false); }</script><div id="wrap" style="position:absolute;left:100px;top:0px;background:#ccc;width:300px;height:300px;"> <h1 id="he" style="text-align:center;width:100%;color:#f00;">0</h1> 鼠标移动这里，转动滚轮，随你而改变！</div></body></html>
转载于:https://www.cnblogs.com/mengwei-ziyun/p/mw_js_controlScroll.html
相关资源：JS控制滚动条自动向下滚动