js鼠标滚动问题

利用鼠标滚动实现等比例扩大或者缩小图片，支持ie和火狐的代码...
<!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><title>...</title></head><body><p>将鼠标放在图片上，然后滚动鼠标滚轮试试看</p>
<p>
<img border="0" src="图片的url"></p>
<script language="javascript">
document.getElementsByTagName('img')[0].onmousewheel=function(){
var zoom=parseInt(this.style.zoom, 10)||100;zoom+=event.wheelDelta/12;if (zoom>0) this.style.zoom=zoom+'%';
return false;
}
</script>
</body></html>
这个只支持IE的。

解决方案 »

  1.   

    http://www.web666.net/dom/scrolltop.html
    看看这里的说明
      

  2.   

    不行的，ff下下面的事件都触发不了    var imgs=document.getElementsByTagName("img");
        var len=imgs.length;
        for(var i=0;i < len;i++) {
            (function(cur){
                cur.onmousewheel=function(e) {
                    e =window.event ||e;alert(e);
                    var zoom=100;
                    if(!this.getAttribute("zoom")){
                        this.setAttribute("_w",this.offsetWidth);
                        this.setAttribute("_h",this.offsetHeight);
                    }else
                        zoom=parseInt(this.getAttribute("zoom"));
                    //alert(!!this.getAttribute("zoom"));
                    zoom+=e.wheelDelta/12;document.title=zoom;
                    this.setAttribute("zoom",zoom);
                    if(zoom>0){
                        this.style.width=(zoom/100)*this.getAttribute("_w")+"px";
                        this.style.height=(zoom/100)*this.getAttribute("_h")+"px";
                    }
                    return false;
                }
            })(imgs[i]);
        }