[jQuery] question about each

[David .Wu]

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?