[jQuery] question about each

[jQuery] question about each


Part1
    var navPath = 'images/nav/';
    var navArr = new Array
('nav_about','nav_product','nav_skill','nav_service','nav_news','nav_member','nav_recruit');
    var navArrLen = navArr.length;
    for(i=0;i<navArrLen;i++)
    {
        $(document.createElement('img')).attr('src',navPath + navArr[i] +
'_over.jpg');
    }
Part2
    $('#nav img:gt(0):lt(7)').each(function(i)
    {
        $(this).data('btnOver',navPath + navArr[i] + '_over.jpg');
        $(this).data('btnOut',$(this).attr('src'));
        $(this).hover(function()
        {
            $(this).attr('src',$(this).data('btnOver'));
        },
        function()
        {
            $(this).attr('src',$(this).data('btnOut'));
        });
    });
Part 1 is about to pre load the images
Part 2 is to give each image a data property; and do the swap image
function when mouse over and out
my question is, the image pre load succeed, but when I mouse over the
image, the browser will connect to server to require something, is
that mean the code do
        $(this).data('btnOver',navPath + navArr[i] + '_over.jpg');
        $(this).data('btnOut',$(this).attr('src'));
these tow lines again and again when mouse over?