Aller au contenu

[RESOLU] Précharger des images sur un site?

Fab23

Par Fab23
dans Programmation et Lignes de code

Messages recommandés

Fab23 Collaborateur

Fab23

Posté(e)
Posté(e)

Salut à tous,

Je fais un site sur lequelle j'ai fais un menu avec du texte (en image) donc pour chaques mot (où liens si vous voulez), j'ai 2 images, la principal et la 2ème au passage de la souris, mais le problème avec ce sysème c'est que quand on pointe la souris, ça doit charger l'image!

Donc il faudrait pouvoir les charger avant (ou quand on arrive sur le site en même temps...)

Donc est-ce que qqun connait un script avec lequel on pourrait le faire... (JAVASCRIPT si possible...)

Merci :-D

ImoTheP Nouveau

ImoTheP

Posté(e)
Posté(e) 

<script type="text/javascript">

function Preload() 
{ 
var im=document; 
if(im.images)
{ 
if(!im.tb) im.tb=new Array();
var i,j=im.tb.length,a=Preload.arguments; 

for(i=0; i<a.length; i++)
 if(a[i].indexOf("#") != 0)
 { 
 	im.tb[j]=new Image; 
 	im.tb[j++].src=a[i];
 }  

}
}
</script>

et tu appelles la fonction Preload() dans le onload en passant en paramètres la ou les image(s)


<body onload="Preload('img/image.png','truc.gif'');">

:pastoutlu:

afbilou Nouveau

afbilou

Posté(e)
Posté(e)

Une bien meilleure solution : http://afbilou.free.fr/tmp/preload.html

Utilisation d'une image unique qui contient les deux etats : par defaut et survolé.

Avec CSS on deplace l'image en question en fonction de l'evenement hover de la souris.

Avantage : n'utilise pas de Javascript et fonctionne donc sur tous les navigateurs supportants CSS. Car javascript peut-etre desactivé par certains utilisateurs ou bien inexistant (eniron 10% des gens).

Fab23 Collaborateur

Fab23

Posté(e)
  • Auteur
Posté(e)
Regarde l'image complète, je pense que tu comprendras pourquoi le backgroup-position est modifié :

image.jpg

Ah oui car au faite la 2ème image est présente mais il l'affiche pas tant qu'on n'est pas aller sur l'autre... C'est ça :-D

Archivé

Ce sujet est désormais archivé et ne peut plus recevoir de nouvelles réponses.

Aller sur la liste des sujets
×
×
  • Créer...