Felix Riesterer: Bilder über onfocus laden

Beitrag lesen

Lieber Baba,

Ich bin aber nicht sicher, ob es noch schöner geht.

klar geht es! Wenn man das Schlüsselwort "this" im onfocus-Attribut notiert, dann bekommt die Funktion als Parameter eine Referenz auf das zu aktualisierende Bild übermittelt.

<img src="" alt="" onfocus="return loadMe(this, '/images/products/nails.gif')" />

function loadMe (img, url) {  
    img.src = url;  
    return false;  
}  
  
// preload: execute this function at once  
(function () {  
    var imgs = document.images; // all <img> elements  
    var pre = []; // will contain new Image() objects  
    var regex = new RegExp(".*this, '([^']+)'.*", "i");  
    var i, img;  
  
    // find all onfocus eventhandler attributes in <img> elements  
    for (i = 0; i < imgs.length; i++) {  
  
        // do we have an onfocus attribute?  
        if (imgs[i].getAttributeNode("onfocus")) {  
  
            // create new image object so the browser loads the image data  
            img = new Image();  
            img.src = imgs[i].getAttributeNode(  
                "onfocus"  
            ).replace(  
                regex,  
                "$1"  
            );  
            pre.push(img);  
        }  
    }  
}());

Der JS-Code ist ungetestet, könnte aber so ähnlich funzen(TM), falls er am Ende(!) des Dokuments eingebunden wird.

Liebe Grüße,

Felix Riesterer.

--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)