5568 sujets

Sémantique web et HTML

Bonjour chers vous tous !

Voilà, j'ai mis des Rollover sur ma premier page en utilisant du code propre (enfin, plus propre que celui que génère dreamweaver en tout cas), et j'ai bien compréssé mes images sous photoshop.
Je précharge également toute mes petites vignettes (la deuxieme image du rollover).

Ce que je ne comprends pas, c'est qu'avec IE, le rollover est lent et ne fonctionne pas très bien alors que sous Firefox, c'est nickel et le rollover apparait instantanément sur chaque image quand on passe dessus...

Auriez vous une idée pour m'aider à arranger ça ?

la page en question

niveau code, j'utilise ça :





<a href="angelique_kidjo/home.html"><img src="images/index/kidjo.jpg" width="205" height="80" border="0"onMouseover="this.src='images/index/kidjo2.jpg'" onMouseout="this.src='images/index/kidjo.jpg'"></a>







Merci d'avance à tous




EDIT :
Je viens de me rendre compte qu'en l'hebergeant chez free, ça va super vite, même avec IE, alors c'est à croire qu'il y a un probleme entre mon IE et OVH ???
J'appelle OVH et pour eux, tout va bien, mais pour moi, et toute les gens que je connais qui visite le site depuis IE, c'est lent.
Et si on visite celui hebergé sur free, c'est super rapide pour tout le monde...

S'il vous plait, dites moi au moins ce que ca donne chez vous, sur IE et/ou sur firefox ? MERCI BEAUCOUP
Modifié par lesfabuleux (29 Mar 2006 - 11:57)
Salut,
Sur IE ça marche. Mais pourquoi faire un rollover alors que tu ne fais que modifier l'opacité. IE et FF offrent cette particularité avec les css, ce qui allègerait ton code et le poids de la page encore plus.

filter:alpha(opacity=60);
-moz-opacity:0.6;
opacity:0.6;
par exemple.
Google est ton ami
Modifié par papyjo (28 Mar 2006 - 21:27)
Merci à tous pour vos réponses.

Voici les miennes :

- il s'agit exactement de la meme page sur free, vraiment la même, et ça marche nikel, meme sur IE.
- Merci pour la faut d'orthographe, c'est une très bonne remarque !!
- Je vais me pencher sur l'histoire des css et de l'opacité (meme si la dernière fois que j'ai fais du css, j'ai failli perdre tout mes cheveux...)

Mais en attendant, si vous avez une idée, n'hésitez pas, j'en ai trop marre !

Damien
Merci mille fois !
J'ai fais mes rollover en css, c'est beaucoup plus léger et beaucoup plus rapide !

Au cas ou quelqu'un aurait le même problème et arriverait ici, voilà le code que j'ai utilisé :



<a href="page.html" class="rollopaque"><img src="img.jpg" /></a>



et dans ma feuille de style

<style type="text/css">
a.rollopaque img {
  opacity: 0.5;
  filter:alpha(opacity=50);
  }

a.rollopaque:hover img {
  opacity: 1.0;
  filter:alpha(opacity=100);   
  }
</style>


encore merci pour votre aide !
Il faudrait que tu rajoutes, comme l'avait mis papyjo dans son code
-moz-opacity: ;

comme ça, ça marchera aussi avec Netscape Smiley smile (en fait mozilla accepte maintenant
opacity: ;

mais ça marche pour Netscape)

Par contre, ça marche pas pour Opéra

Ah oui, j'allais oublier, tu as inversé tes opacités, c'est 100 sur a et 50 sur a:hover dans ton cas Smiley cligne
Modifié par blue (29 Mar 2006 - 18:36)
Salut, Smiley smile

C'est pas très valide tout ça ... Smiley rolleyes

Validateur de CSS a écrit :

* Ligne: 61 Contexte : .rollopaque img

La propriété opacity n'existe pas. : 1.0
* Ligne: 62 Contexte : .rollopaque img

Erreur lors de l'analyse grammaticale. - opacity=100)
* Ligne: 67 Contexte : .rollopaque:hover img

La propriété opacity n'existe pas. : 0.5
* Ligne: 68 Contexte : .rollopaque:hover img

Erreur lors de l'analyse grammaticale. - opacity=50)
C'est assez étrange mais ça marche beaucoup moins bien avec FF 1.5 qu'avec FF 1.0x
J'ai fait un essai avec une photographie d'une grande taille : alors que l'opacité apparaît tout de suite au survol sur FF 1.0x (comme sur IE), il faut attendre environ 2 secondes (ce qui est long mine de rien) avec FF 1.5 !

J'ai également essayé avec une version portable, sans extension, c'est pareil.
D'ailleurs même sur les petites images de cette page je remarque que c'est plus long avec 1.5
Modifié par Alan (30 Mar 2006 - 19:14)