1
2
3
4
<img id="img1" src="http://www.jq22.com/img/cs/500x500-1.png" width="200">
<span>
    <img id="img2" src="http://www.jq22.com/img/cs/500x500-1.png ">
</span>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
$(function() {
    $("img").bind("mousemove", function() {
        //计算
        var x = event.offsetX / $(this).width();
        var y = event.offsetY / $(this).height();
        console.info(x + ":" + y);
        $("span").scrollLeft($("#img2").width() * x);
        $("span").scrollTop($("#img2").height() * y);
    })
})
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX