<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

    <body style="height: 2000px;">

        <style type="text/css">

            #div1{width:100px;height:100px;background: red;}

        </style>

        <script type="text/javascript">

            window.onload = function(){

                var oDiv = document.getElementById('div1');

                /*

                ie/chrome : onmousewheel

                    event.wheelDelta  //firefox 下没有这个属性

                    上 ： 120

                    下 ：-120

                firefox : DOMMouseScroll  必须用addEventListener

                addEventListener 必须是标准浏览器才支持 （ie6 7 8 用的是attachEvent）

                    event.detail

                    上：-3

                    下：3                    

                return false 阻止的是 obj.on事件名称=fn 所触发的默认行为

                addEventListener绑定的事件需要通过event下面的preventDefault();

                */

                oDiv.onmousewheel = fn;

                if(oDiv.addEventListener){

                    oDiv.addEventListener('DOMMouseScroll', fn ,false);

                }

                function fn(ev){

                    //alert()

                    var ev = ev || event;

                    //alert(ev.wheelDelta);

                    //alert(ev.detail)

                    var b = true;

                    if(ev.wheelDelta){

                        b = ev.wheelDelta > 0 ? true : false

                    }else{

                        b = ev.detail <  0 ? true : false

                    }

                    //alert(b)

                    if(b){

                        this.style.height = this.offsetHeight - 10+'px';

                    }else{

                        this.style.height = this.offsetHeight + 10+'px';

                    }

                    if(ev.preventDefault){

                        ev.preventDefault();

                    }

                    return false;

                }

            }

        </script>

        <script type="text/javascript">

            //return false 阻止的是 obj.on事件名称=fn 所触发的默认行为

            //    addEventListener绑定的事件需要通过event下面的preventDefault();

            //阻止默认行为是根据事件的绑定决定的

            //右键行为阻止

            var context1 = function(){

                document.oncontextmenu = function (){// chrome

                    return false;

                }

            }

            //context1()  //标准浏览器

            var context2 = function (){

                document.addEventListener('contextmenu',function(ev){

                    ev.preventDefault();

                    //return false;

                })

            }

            //context2()

            var context3 = function(){

                document.attachEvent('contextmenu',function(){

                    return false;

                })

            }

            context3() //IE非标准

        </script>

        <div id="div1"></div>

    </body>

</html>