> I'm not sure it's possible to cancel the request by itself, but it's still 
> possible to change your src value or delete your img variable which result in 
> a behavior similar to a request cancellation.
> 
> Jérémie
> 
> 2010/12/22 Steve Esson <[email protected]>
> On Wed, Dec 22, 2010 at 3:52 AM, Amit Agarwal <[email protected]> wrote:
> > Hi,
> >
> > How to abort an Image request which is still on the fly?
> >


Here is an example of handling an image that fails to load properly then hiding 
it ( observe - method defined in prototype library )

// check if images load properly returns false if image not loaded properly
function imgOK(img) {
        if (!img.complete) {
                return false;
        }
        if (typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) {
                return false;
        }
        return true;
}

// $, $$ used by prototype library

// test if images load ok
// links have images 
var $thumbLink = $$('div.product-view div.more-views a');
// hide links when images do no load properly.
if ($thumbLink.length>0) {
        document.observe("dom:loaded", function() {
                $thumbLink.each(function(s, index) {
                        var thumbImg = $thumbLink[index].firstDescendant(),
                               obj = $(s).firstDescendant();
                        console.log(thumbImg.src + " > is ok : " + imgOK(obj));
                        if ( imgOK(obj) == false) {
                                console.log('bad image!');
                                $(s).addClassName('no-display');
                        }
                });
        });
}


> > Example:
> >
> > var img = new Image();
> > var img.src = "http://www.google.co.in/images/nav_logo29.png";;
> > window.setTimeout(function(){
> >      //Code to abort/cancel image request if it hasn't triggered onload or
> > onerror even after 20 seconds of sending request.


I am not sure about setting a max time to request the image in the example 
above the dom load event is observed and then the image is checked to see if it 
is ready to display or bad; if no good just hide from view with CSS class.


> > },20000)
> 
> This works for me:
> 
> var img = new Image();
>                img.src = "http://dummyimage.com/2600x2400/000/fff";;
>                window.setTimeout(function(){
>                         img.src = "about:blank";
>                },1);
> 
> --
> 
> -- 
> Jeremie
> .............................
> Web : http://jeremie.patonnier.net
> Twitter : @JeremiePat
> 

-- 
To view archived discussions from the original JSMentors Mailman list: 
http://www.mail-archive.com/[email protected]/

To search via a non-Google archive, visit here: 
http://www.mail-archive.com/[email protected]/

To unsubscribe from this group, send email to
[email protected]

Reply via email to