有关循环变量的JavaScript问题

Question

说我编写了如下代码：

function over(i) {
    var num = -100 * i;
    var show = document.getElementById("ha");
    show.style.top = num.toString() + "px";
}

function leave() {
    var show = document.getElementById("ha");
    show.style.top = "0px";
}

function slideShow() {
    var refs = document.getElementsByTagName("a");
    var show = document.getElementById("ha");
    show.style.position = "absolute";
    show.style.left = "0px";
    show.style.top = "0px";
    // refs[0].onmouseover = function () {
    //     over(0);
    // };
    // refs[1].onmouseover = function () {
    //     over(1);
    // };
    // refs[2].onmouseover = function () {
    //     over(2);
    // };
    for (i = 0; i < refs.length; ++i) {
        refs[i].onmouseover = function () {
            over(i);
        };
        refs[i].onmouseleave = function () {
            leave();
        };
    }
}

addLoadEvent(slideShow);

我想显示鼠标悬停在<a>上的图像的特定区域。但是，似乎i中over(i)中所有refs[i].onmouseover都设置为3，即refs.length。有人可以帮助我吗？我完全是脚本语言的新秀。