鼠标移入放大

    <img src="" id="src" width="202" />
    <div id="dst"><img src="" /></div>
    <script>
        var src = document.getElementById("src");
        var dst = document.getElementById('dst');
        //绑定鼠标经过事件
        src.onmouseover = function () {
            //显示预览区域
            dst.style.display = "block";
            //移动到指定位置
            
            var x = this.offsetLeft + this.offsetWidth + 5;
            alert(this.offsetLeft);
            alert(this.offsetWidth);
            dst.style.left = x + "px";
            dst.style.top = this.offsetTop + "px";
        }
        
        //添加鼠标移动事件
        src.onmousemove = function (event) {
            //设置event对象 兼容写法
            var event = window.event || event;
            //计算鼠标在图片中的水平和垂直位置
            var x = event.clientX - this.offsetLeft;
            var y = event.clientY - this.offsetTop;
            //让预览区大图滚到指定位置（经过相应倍率放大的位置）
            dst.scrollLeft = x*3;//此处不带单位
            dst.scrollTop = y*3;
        }
    </script>