jQuery, загружающий изображения полным обратным вызовом

Question

jQuery, загружающий изображения полным обратным вызовом

Я видел комментарий к блогу Ben Nadel, где Stephen Rushing отправил загрузчик, но я не могу выяснить, как я могу передать селекторы и параметр.. Я думаю, что мне также нужны completeCallback и функции errorCallback?

function imgLoad(img, completeCallback, errorCallback) {
    if (img != null && completeCallback != null) {
        var loadWatch = setInterval(watch, 500);
        function watch() {
            if (img.complete) {
                clearInterval(loadWatch);
                completeCallback(img);
            }
        }
    } else {
        if (typeof errorCallback == "function") errorCallback();
    }
}
// then call this from anywhere
imgLoad($("img.selector")[0], function(img) {
    $(img).fadeIn();
});

HTML:

JS:

$(document).ready(function() {
    var newImage = "images/002.jpg";
    $("#myImage").css("display","none");
    $("a.tnClick").click(function() {
        // imgLoad here
    });
})

10

jquery image load complete

задан FFish 6 March 2010 в 12:28

1 ответ

Другие вопросы по тегам:

jquery image load complete

Похожие вопросы:

score 40 · Accepted Answer

Если вы хотите, чтобы он загружался перед показом, вы можете значительно сократить его, например:

$(document).ready(function() {
    var newImage = "images/002.jpg"; //Image name

    $("a.tnClick").click(function() {
      $("#myImage").hide() //Hide it
        .one('load', function() { //Set something to run when it finishes loading
          $(this).fadeIn(); //Fade it in when loaded
        })
        .attr('src', newImage) //Set the source so it begins fetching
        .each(function() {
          //Cache fix for browsers that don't trigger .load()
          if(this.complete) $(this).trigger('load');
        });
    });
});

Вызов .one () гарантирует, что .load () запускается только один раз, поэтому нет повторяющиеся плавные переходы. .each () в конце вызван тем, что некоторые браузеры не запускают событие load для изображений, полученных из кеша, это то, что пытается сделать опрос в опубликованном вами примере тоже.