Maison > interface Web > js tutoriel > Comment puis-je précharger efficacement des images avec jQuery ?

Comment puis-je précharger efficacement des images avec jQuery ?

Mary-Kate Olsen
Libérer: 2024-12-18 00:20:10
original
864 Les gens l'ont consulté

How Can I Efficiently Preload Images with jQuery?

Préchargement efficace des images avec jQuery

Si vous recherchez une approche rationalisée pour précharger des images à l'aide de JavaScript avec jQuery, envisagez les solutions suivantes :

Méthode simple et rapide

Pour un approche légère et simple, essayez cette fonction :

function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
        $('<img/>')[0].src = this;
        // Alternatively:
        // (new Image()).src = this;
    });
}
Copier après la connexion

Utilisation :

preload([
    'img/imageName.jpg',
    'img/anotherOne.jpg',
    'img/blahblahblah.jpg'
]);
Copier après la connexion

Plugin jQuery

Si vous préférez une approche basée sur un plugin solution :

$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
}
Copier après la connexion

Utilisation :

$(['img1.jpg','img2.jpg','img3.jpg']).preload();
Copier après la connexion

Ces méthodes offrent un moyen rapide, facile et efficace de précharger des images dans jQuery.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal