préchargement en CSS pour roll over (trouvé)

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : préchargement en CSS pour roll over (trouvé)

hlelong

J'ai des problèmes entre Mozilla et IE avec les préchargement d'image. J'essaye de remplacer une fonction compliquée en JS par du CSS, c'est plusse mieusse.

soit le CSS :

Code :

a.roll1 {
width: 100px;
height: 25px;
background: url(ikebana.jpg);
padding-left:100px;
margin :0;
border:0;
}
a.roll1:hover {
background: url(ikebana2.jpg);
}

..............

dans la page :

Code :

<a class="roll1" href="histori.htm" title="ikebana japonais"></a>

dans mozilla ça marche parfaitement (si j'enlève le padding-left l'image disparaît)

dans IE (6) je ne vois plus que le lien lui-même en bas, et rien dans la page, même pas le title.

..
Je me dis que c'est un problème de taille de boîte, mais je n'en suis pas sûr, et je ne trouve pas la solution.
Donc si quelqu'un peut me dire où je fais une erreur, j'aimerais bien.
Merci

...

J'ai trouvé.. je laisse le message aucazou :
IE veut au moins un caractère à afficher, bon, alors :

Code :

<a class="roll1" href="histori.htm" title="ikebana japonais"> </a>

Message édité par hlelong le 06-10-2005 à 17:02:27

Publicité

j_lecruel

☀ ☁ ☂

Salut,

un lien est par défaut un élément inline, c'est à dire que sa taille varie en fonction du contenu ; les propriétés width et height n'ont donc aucun effet.

Pour définir la taille il te faut mettre ceci :

Code :

display:block;

Et tu peux virer ton padding-left.

Sinon une petite remarque... le fait d'utiliser 2 images différentes pour un rollover est une mauvaise idée : si le curseur passe sur ton lien avant que la 2° image n'ait été chargée rien ne s'affichera. Il vaut mieux utiliser une seule image contenant les 2 états, et décaler le background pour le hover avec la propriété background-position..

---------------
♈ ♋ ♌ ♍ ♎ ♏ - Agora Fidelio | Galerie d'art Toulousaine

gatsusat

un rollover doit plutot etre fait en utilisant la techinique des portes coulissantes. en gros tu décale le background lors du hover

Message cité 1 fois

fafane84

Salut :hello:

pour éviter le pré-chargement des images j'utilise une technique vu sur Alsacréations (je pense que c'est la même que Gatsusat) et que j'ai évoqué sur un autre forum >>ici<<.

[:fafane84]

Message cité 1 fois
Message édité par fafane84 le 07-10-2005 à 09:12:27

---------------
Mon Topic de Vente Hardware

bl@p_psx

Admin G15-france

gatsusat a écrit :

un rollover doit plutot etre fait en utilisant la techinique des portes coulissantes. en gros tu décale le background lors du hover

fafane84 a écrit :

:ange:

---------------
:Moultiplayers:.:Quatuor Chevalier:.:Admin G15-france.com:.:Wiki -G15-france:.:-Papa-:.

gatsusat

Appelle moi dieu !

Message cité 1 fois

---------------
Les CSS c'est bon mangez-en

plainsofpain

Pingouino's lover

gatsusat a écrit :

Appelle moi dieu !

[:the real moins moins]

---------------
http://www.alsacreations.com , http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net/. Exemple à ne surtout pas suivre : www.worldinternet.be

FORUM HardWare.fr

Programmation

HTML/CSS

préchargement en CSS pour roll over (trouvé)

Sujets relatifs
[CSS] Affichage 2 images en même temps ?	CSS : caler une image de fond sur un texte centré.
CSS : Afficher un bloc lors du survol d'un lien	Menu Roll over
[TABLE/CSS] Tableau avec ascenseur !	Redimensionnement, CSS & JavaScript ;)
CSS : positionner une image ou un bloc en bas d'un autre bloc	Css, séparer une boite en 2, imbrication ?
[CSS] IE n'aime pas mon code...
Plus de sujets relatifs à : préchargement en CSS pour roll over (trouvé)

Page générée en 0.043 secondes