使用javascript实现鼠标滑轮及按钮同时控制图片的大小

我这里是点放大缩小没反映,但是鼠标滚轮就有反映

解决方案 »

  1.   

    <html>
    <head>
    <meta http-equiy="content-type" content="text/html; charset=gb2312">
    <script type="text/javascript">
    var wheel = {
    move : function (e) {
    var e = window.event || e,
    o = e.srcElement || e.target,
    n = (e.wheelDelta || e.detail) > 0 ? -10 : 10;
    wheel.addN(o, n);
    },
    addN : function (o, n) {
    o.style.width = o.offsetWidth + n;
    o.style.height = o.offsetHeight + n;
    },
    add : function (o) {
    if (o.attachEvent)
    o.attachEvent("onmousewheel", wheel.move);
    else
    o.addEventListener("DOMMouseScroll", wheel.move, false);
    }
    };
    var n_onload = function () {
    wheel.add(document.getElementById("div"));
    },
    change = function (n) {
    wheel.addN(document.getElementById("div"), n);
    };
    if (window.attachEvent)
    window.attachEvent("onload", n_onload);
    else
    window.addEventListener("load", n_onload, false);
    </script>
    </head>
    <body>
    <img id="div" height="100" width="100" src="11645336193746747_small.jpg" />
    <br /><input type="button" value="加" onClick="change(50)" />&nbsp;<input type="button" value="减" onClick="change(-50)" />
    </body>
    </html>