javascript - 图像阵列预加载显示沙漏光标，同时预加载

Question

我正在使用以下脚本预加载图像；想知道如何在等待完成预加载时显示沙漏光标。

function preload_images() {

            var i;
            for (i = 1; i < sl; i++) {
                images[i] = new Image();
                $('#selector').css('cursor', 'wait');
                var name = impath.toString() + imStart.toString() + i + ext;
                images[i].src = 'ImageHandler.ashx?img=' + name + '&window=50&level=50 &slice=0';
                $('#selector').css('cursor', 'default');
            }
        }

Answer 1

使用图像的load和error（以防任何图像未加载）事件来计算已加载的图像数量，以及当所有加载时移除光标。

    function preload_images() {
        var i, count = 0;
        $('#selector').css('cursor', 'wait');
        for (i = 0; i < sl; i++) {
            images[i] = new Image();
            var name = impath.toString() + imStart.toString() + i + ext;
            image[i].onload = image[i].onerror = function(){
                count++;
                if (count == sl){
                    $('#selector').css('cursor', 'default');
                }
            }                
            images[i].src = 'ImageHandler.ashx?img=' + name + '&window=50&level=50 &slice=0';
        }
    }