5568 sujets

Sémantique web et HTML

Pages :
(reprise du message précédent)

J'ai essayé le traitement par class= articles mais ça n'a pas marché :

<div id="articles">
		<div class="article">
			<h3 class="selected"><a href="#">Massacre aux Philippines: le clan a tué 200 autres personnes</a></h3>
			<div class="montre">
				<img class="imag"src="news1.jpg" alt="Figure 1" />
			</div>
		</div>
		<div class="article">
			<h3><a href="#">Le patronat européen prêt à des efforts sur le CO2 si les Etats-Unis 
			suivent</a></h3>
			<div>
				<img class="imag" src="news2.jpg" alt="Figure 2" />
			</div>
		</div>
		<div class="article">
			<h3><a href="#">Johnny Hallyday hospitalisé à Los Angeles</a></h3>
			<div>
				<img class="imag" src="news3.jpg" alt="Figure 3" />
			</div>
		</div>
	</div>
	<div id="articles">
		<div class="article">
			<h3 class="selected"><a href="#">Massacre aux Philippines: le clan a tué 200 autres personnes</a></h3>
			<div class="montre">
				<img class="imag"src="news1.jpg" alt="Figure 1" />
			</div>
		</div>
		<div class="article">
			<h3><a href="#">Le patronat européen prêt à des efforts sur le CO2 si les Etats-Unis 
			suivent</a></h3>
			<div>
				<img class="imag" src="news2.jpg" alt="Figure 2" />
			</div>
		</div>
		<div class="article">
			<h3><a href="#">Johnny Hallyday hospitalisé à Los Angeles</a></h3>
			<div>
				<img class="imag" src="news3.jpg" alt="Figure 3" />
			</div>
		</div>
	</div>
	<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
	<script type="text/javascript">
			$(document).ready( function () {
				//tabindex pour la navigation au clavier
				$(".articles h3").attr("tabindex", "0");
				$(".articles h3").focus (
					function () {
						//trucs à faire pendant le focus sur les h3
						$(".articles div.montre").removeClass("montre");
						$(".articles h3.selected").removeClass("selected");
						$(this).next("div").addClass("montre");
						$(this).addClass("selected");
					}
				);
				// gestion des hover sur les h3 :
				$("div.article h3").hover( 
					function () {
						//trucs à faire pendant le over sur les h3
						$(".articles div.montre").removeClass("montre");
						$(".articles h3.selected").removeClass("selected");
						$(this).next("div").addClass("montre");
						$(this).addClass("selected");
					},
					function () {
						//out : trucs à faire éventuellement quand le pointeur sort du h3
					}
				);
			});
	</script>
Bonjour,

J'aimerais bien savoir ce que doit etre ecrit dans cette ligne :


function () {
//out : trucs à faire éventuellement quand le pointeur sort du h3                     
}
Il faut y écrire le code JavaScript correspondant aux «trucs à faire éventuellement quand le pointeur sort du h3». Veux-tu faire des trucs éventuellement quand le pointeur sort du H3?
apt a écrit :
Par exemple :

Afficher la premiere image ...

OK c'est parti. On te laisse travailler dessus et revenir nous voir si ton code ne fonctionne pas comme tu le voudrais.
Tu as deux div avec les mêmes ID, les ID doivent être uniques. Soit tu regroupes tout dans un même div, soit tu fais deux div avec des ID différents (mais alors il ne faut pas oublier de compléter/corriger les css).
Pages :