Titre: aide css et amélioration
Posté par: deglingue le le 02-01-2005 a 10:08:14
Bonjour à tous,
Novice en création de site, j'ai essayé le css sur une nouvelle version de mon site http://www.deglingue.com
Voici mes problèmes:
- Les boutons qui au passage de la souris change d'état : j'aimerai savoir comment faire pour les incorporer à ma feuille css pour ne pas qu'elle allourdissent le chargement de chacune de mes pages.
- La lourdeur de mes pages (j'ai l'impression) : est il possible d'améliorer cela encore ? (la 1ère question sera déjà une réponse je suppose)
Voilà j'ai essayé d'être clair (peut etre pas assez :))
Si vous avez d'autres idées d'améliorations je vous écoute et svp restez assez clair dans vos réponses car je ne suis pas expert en webmastering
Merci d'avance |
Titre: Re:aide css et amélioration
Posté par: bigornot le le 02-01-2005 a 11:48:13
Alors ...
je ne te donnes pas le code, mais l'idée :
tu fais un div.
le background-image de ce div est l'image de départ.
Puis, tu fais, dans ta feuille : div:hover {
et là, tu mets en background-image l'image que tu veux afficher au passage de la souris ....
et voilà!
|
Titre: Re:aide css et amélioration
Posté par: deglingue le le 02-01-2005 a 15:20:07
Ca y'est ca marche.. j'ai cherché juste un moment (pas long) car pour que l'image survolée change il a fallu en faite que j'utilise le nom de la balise <a> et non pas celle de <div>
c'est à dire : exemple pour un bouton
a.bouton1 {
width:110px;
height: 35px;
background-image: url('../bouton/accueil_1.png');
border: 0px;
margin-top:5px;
}
a.bouton1:hover {
width:110px;
height: 35px;
background-image: url('../bouton/accueil_2.png');
border: 0px;
margin-top:5px;
}
Et là ca marche.. Il me reste à tout mettre à jour et voir si ca allège mon site ou pas sinon je reviendrai vous voir ;D
Je commence à réellement apprécier le css je trouve ca très pratique.. Et encore merci Bigornot .
|
Titre: Re:aide css et amélioration
Posté par: deglingue le le 02-01-2005 a 16:34:14
Encore remoi,
J'ai mis le résultat en ligne.. il est clair que c'est beaucoup plus net beaucoup plus facil aussi de mettre à jour une seule page qu'une cinquantaine.. Maintenant (est ce que je post au bon endroit ?) je me pose cette question:
Pourquoi à chaque fois que je change de page html sur mon site il me recharge toutes les images comme sur la page index.. ca ralenti vachement la navigation je trouve.. Y'a t il moyen d'arranger cela ?
Merci
le lien est en haut ;) |
Titre: Re:aide css et amélioration
Posté par: bigornot le le 02-01-2005 a 17:48:39
| par contre, les png sont mal pris en compte par ie, et le menu est invisible sous firefox |
Titre: Re:aide css et amélioration
Posté par: deglingue le le 02-01-2005 a 18:42:25
A mon avis ca doit venir des temps de chargement sous ie par contre sous mozilla je pige pas là.. je viens d'essayer de les passer en gif (plus volumineux) c'est pas mieux voir pire, ie ou mozilla.. :D
une idée ?
Merci |
Titre: Re:aide css et amélioration
Posté par: deglingue le le 03-01-2005 a 19:39:44
j'ai changé le lien en attendant de trouver une réponse à mon problème.. de mon coté je cherche et je vois pas pourquoi quand les boutons sont chargés depuis le css ils disparaissent, mettent du temps à se charger aussi sous ie et pourquoi sont carrément invisible sous mozilla..
Alors voilà le lien il y'a juste l'index
http://www.deglingue.com/essai/index.html
Merci |
Titre: Re:aide css et amélioration
Posté par: bigornot le le 03-01-2005 a 20:04:22
Le chargement est suuupeeeer long, et pendant un moment, la page était blanche ...
le menu n'apparait pas sous firefox ... :-X |
Titre: Re:aide css et amélioration
Posté par: deglingue le le 03-01-2005 a 20:29:03
c'est pour ca que je pose la question je sais bien qu'il est invisible sous firefox et qu'il est super long sous ie (c'est d'ailleurs pour ca que ca disparait)..
revoilà le lien et merci d'avance
http://www.deglingue.com/essai/index.html
|
Titre: Re:aide css et amélioration
Posté par: PsyKoTiK le le 04-01-2005 a 11:37:51
Il faut savoir que seul les pseudo-format sont acceptés pour IE ;, voila la source de ton bug
pour ton bug de rechargement je pense que c'est ton navigateur qui est mal configuré ... ou encore ta feuille de style qui n'est pas externe et qui le devrait ...
++
|
Titre: Re:aide css et amélioration
Posté par: deglingue le le 04-01-2005 a 14:28:41
salut,
ma feuille de style est bien externe.. cela n'explique pas l'absence du menu sous firefox et apperement c'est la trop grande taille de mes fichiers images qui nuit pour ie..
j'aimerai quand même bien trouvé la réponse pour firefox
:P
Merci |
Titre: Re:aide css et amélioration
Posté par: bigornot le le 05-01-2005 a 12:54:19
C'est bizarre ...
essaye ça:
essaye de transformer ton a en img (en gros, tu fais ton lien comme ça :
<a href=""><img class="" border="0"></a>
|
Titre: Re:aide css et amélioration
Posté par: deglingue le le 05-01-2005 a 14:29:14
Mais là ca devrait marcher en faite (c'est à peu prêt ce que j'avais au début) mais je perd l'interêt de gérer mes boutons depuis la feuille css.. car imaginons je modifie une chose il faut que je le fasse sur toutes les pages enfin je pense que je vais devoir m'y résigner.. soit le css a des limites aussi ou alors (et c'est plus probable) je suis trop limiter encore moi même ;D et dans ce cas j'y reviendrai plus tard..
Si desfois quelqu'un à la réponse à cet énigme j'écouterai..
Merci à ton aide bigornot j'aurai quand même appris quelques trucs. |
Titre: Re:aide css et amélioration
Posté par: bigornot le le 05-01-2005 a 15:26:32
| dans ce cas là, tu fais un include en php, ou en html ... ::) |
Titre: Re:aide css et amélioration
Posté par: deglingue le le 05-01-2005 a 18:21:16
Remoi,
http://www.deglingue.com/essai/index.html
ca y'est ca marche sous ie et firefox.. j'ai fini par trouver coup de chance parce que j'allais laisser tomber.. en fait dans ma css au chargement d'image il fallait rajouter pour chaque bouton le
display: block;
maintenant que ca marche (et dites moi si chez vous aussi ca marche => ie et firefox) vous remarquerez que ca bug légèrement par moment quand on passe la souris rapidement desfois sur les boutons.. J'ai déjà réduit la taille de mes boutons et des mes fichiers images pour en arrivé à 55ko au total.. Mais peut être que j'ai mal écris un code ou qu'il y a des choses qui pourrait faire que ca marche encore mieux.
Je suis déjà très content d'avoir résolu ce premier problème ;D
Merci
ps : background-repeat : no-repeat; pourrait il servir à quelque chose ? |
Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.
|