[resolu] Roolover sur une image sans javascript????

Salut à toutes et à tous,


Je tenter de supprimer toute intrusion du javascript dans le code HTML. Pour cela je compte utiliser diverses propriétée CSS comme ":hover", ":visited", ":active" ou ":link"

Actuellement je cherche à savoir si il est plus cohérent de cacher/afficher une image directement sur c'elle ci en CSS :

img:hover {display: none;}

sur une balise qui l'encadre avec par exemple :

p:hover {display: none;}

sur une class :

.MAclass:hover {display: none;}

ou tout simplement directement sur un div (avec id ou class)

Voilou, théoriquement toutes ces methode fonctionne mais je prefere rester dans les règles et rester coherent avec d'autres methodes déjà employé et surtout permettant d'utiliser des techniques courante pour centrer les élements par rapports à leur parents.
Modifié par percherie (14 Apr 2006 - 18:55)

Bonjour,

Dans l'absolu, les 3 méthodes sont toutes valables. Le choix de l'une d'entre elles ne dépend que d'un contexte précis.

A savoir cependant : IE n'acceptera pas les 2 premières syntaxes proposées, il n'accepte la pseudo classe :hover sur un élément <a> uniquement (ou une classe appliquée à un élément <a>)

ok, je te remerci... je suis en train de faire different essais et il y a pas mal de problèmes de positionnement.

Pour voir ce que je cherche à modifier, c'est sur cette page d'essais : http://toutenkamion.net/

En ce moment je tenter de refaire le script du survol de la carte de l'Albanie mais je suis confronté à plusieurs problèmes et restriction :
- La fiche pays est centrée dans la zone clair restante
- La grande image est elle centrée sur la miniature

Pour l'instant je pense sortir la grande image du flux pour la placer en absolu mais je profite plus du centrage de la fiche qui est son parent.

Peut etre qu'en plaçant la grande image en relatif ça résoudrait ce problème mais il y a de forte chance pour ça modifie toute ma mise en page en deplaçant vers le bas ce qui ce trouve après dans le flux

Pour l'instant j'en suis qu'au supposion et je cherche mais si une personne à déjà trouvé une piste qu'elle me fasse signe
Modifié par percherie (26 Aug 2006 - 15:13)

Je pense avoir trouver quelques chose d'acceptable mais incompatible avec IE, ce n'est pas très grave, l'accebilitée est conservé

Avant de marquer le sujet comme résolu j'aimerai avoir quelques avis sur la question, je suis encore débutant... j'ai surement fait quelques belle erreurs

#menu {
	height: 100%;
	width: 210px;
	position: absolute;
	background-color: #FFFFFF;
}
#corps {
	margin-left: 210px;
}
#tete {
	text-align: center;
}
#fiche {
	background-color: #CCCCCC;
	width: 60%;
	margin-right: auto;
	margin-left: auto;
}
#fiche #grand {
	background-color: #999999;
	position: absolute;
	visibility: hidden;
}
#fiche:hover #grand {
	visibility: visible;
}

<div id="menu">
  <p>TITRE 1</p>
  <p>TITRE 2</p>
  <p>TITRE 3</p>
  <p>TITRE 4</p>
  <p>TITRE 5 </p>
</div>
<div id="corps">
  <h1 id="tete">Titre de l'entete</h1>
  <div id="fiche">
    <div id="grand">
      <p>ICI POTO EN GRANDE DIM</p>
      <p>ICI POTO EN GRANDE DIM ICI POTO EN GRANDE DIM</p>
      <p>ICI POTO EN GRANDE DIM </p>
      <p>ICI POTO EN GRANDE DIM</p>
      <p>ICI POTO EN GRANDE DIM</p>
    </div>
    <p>ICI PHOTO EN PETITE DIM<br />
      ICI PHOTO EN PETITE DIM<br />
      ICI PHOTO EN PETITE DIM</p>
  </div>
</div>

a écrit :
Pour l'instant je pense sortir la grande image du flux pour la placer en absolu mais je profite plus du centrage de la fiche qui est son parent.

Ah, pourquoi ? si le parent est positionné en relatif, tu pourras positionner ton image en absolu convenablement.

HO c'est vrais ça... j'avais oublié ça, j'ai la tête qui surcharge avec toutes ces nouvelles chose à apprendre

je part sur cette piste et poste mon nouveau code

Tous est ok (à mes noeils), j'en ai même profiter pour l'integrer sur la page en construction : http://toutenkamion.net/

Dans un <div> positionner en relatif j'ai placer un <div> masqué dans celui ci qui s'affiche grace aux CSS tous ça sans script javascript, c'est plus propre à mon gout.
Modifié par percherie (26 Aug 2006 - 15:13)