Sondage du mois

Sondage du mois
 

  La connaissance ne vaut que si elle est partagée par tous




 
  Astuce Adobe Photoshop : Raccourci niveaux : Ctrl L




Les blogs > Blog de Percoman

Infos de Percoman

Voir sa Fiche Membre

  • Blog conçu le : 07 Avril 2008
  • Nombre d'articles : 6
  • Nombre de pages vues : 10279
  • Adresse Email :

Les articles du blog

Blog de Percoman
Blog de Percoman - prechargement des images sans javascript
le 07/01/2009 à 20h13 - 6 commentaires   

prechargement des images sans javascript

5/5 (1 votes)

Objectif : ne plus avoir d'espace blanc lors du chargement des images quand on veut effectué un changement d'image sur un hover.

Solution : mettre les images dans le body HTML comme pour les mettre à l'écran mais on va les entourés d'une DIV invisible.

CODE CSS


div#nav_home {

	background-image: url('nav_home.jpg');

	width: 30px;

	height: 17px;

}

div#nav_home:hover {

	background-image: url('nav_home_on.jpg');

	width: 30px;

	height: 17px;

}



CODE HTML


<div style="display:none;">

	<img src="nav_home_on.jpg" alt="" />

</div>



<div id="nav_home"></div>





Partager sur Twitter

Commentaires

balboulloude, le 07/01/2009 à 21h00
 
CODE HTML


<div style="display:none;">



hum faudrait pas plutôt
CODE HTML


<div style="visibility:hidden;">



(et puis une position absolute pour les cacher vraiment)

car je crois qu'en display:none, elles ne sont pas chargées... à vérifier




Percoman, le 07/01/2009 à 23h09
  Déjà vérifié je l'utilise lol. C'est pour sa que je met ma solution ici.



balboulloude, le 08/01/2009 à 12h36
  Ah ok , merci :)



Igixcs, le 09/01/2009 à 15h04
  perso, je prefere le background-position :Da



Percoman, le 09/01/2009 à 20h54
  Ben fait ton background-position naaaah :p



Igixcs, le 09/01/2009 à 23h28
  mais c'est plus long à charger avec le bgPosition? (images plus grandes)??? emotion



Vous devez être membre pour poster des commentaires sur le site.

DERNIÈRES PUBLICATIONS DE OPEN-MOUTHED

En direct de open-mouthed.com