11548 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Problème de pseudo classe active avec un require_once

Bonjour à tous.

Je ne suis pas sûr d'être au bon endroit pour poster ce message, mais je ne trouvais pas plus cohérent Smiley smile

J'ai un soucis avec un basculement de classe "active" sur un menu lorsque les liens appellent des pages via un require_once.

Je m'explique.

Le code de la page index.php


<div id="menu-top">
			<ul class="nav">
				<li><a class="en-cours" href="index.php?page=accueil" target="_self">Accueil</a></li>
				<li><a href="index.php?page=ceomusic" target="_self">CEO Music</a></li>
				<li><a href="index.php?page=artistes" target="_self">Artistes</a></li>
				<li><a href="index.php?page=actualites" target="_self">Actualités</a></li>
				<li><a href="index.php?page=agenda" target="_self">Agenda</a></li>
				<li><a href="#" target="_self">Boutique</a></li>
			</ul>
		</div>
	</div>
	
	<div id="content">
		<?
			switch ($_GET['page'])
			{
				case "accueil" :
					require_once('accueil.php');
						break;
				case "ceomusic" :
					include 'ceomusic.php';
						break;
				case "artistes" :
					include 'artistes.php';
						break;
				case "actualites" :
					include 'actualites.php';
						break;
				case "agenda" :
					include 'agenda.php';
						break;
				default:
					include 'accueil.php';
			}
			?>
	</div>


Le code JS pour modifier le lien ayant la classe "en-cours"


//MENU-TOP CLASSE EN-COURS
	$("ul.nav li a").bind("click", function() {
	
		$("ul.nav li a").removeClass("en-cours");
		$(this).addClass("en-cours");	
	});



Ce qu'il se passe concrètement, c'est que la classe "en-cours" bascule sur l'élément cliqué juste après le clic, mais une fois la page chargée via le "require_once", elle rebascule immédiatement par défaut sur "ACCUEIL"

L'exemple en ligne : http://www.thomasdemoura.fr/_MODULES/ceomusic

Merci d'avance de votre aide.
Bonjour,
C'est parce que tu cliques sur un lien, une autre page est chargée. Or, ton script JavaScript va permettre de modifier l'apparence du lien sur la page en cours.
Ce n'est pas en JavaScript que tu dois gérer ça, mais en PHP.
Pour chaque lien, tu fais quelque chose du type :
<a <?php if($_GET['page']=="ceomusic") echo 'class="en-cours"'; ?> href="index.php?page=ceomusic">CEO Music</a>

Modifié par Gothor (27 Jul 2012 - 19:13)
Salut Gothor !

Merci beaucoup, le problème est résolu !

Saurais-tu me dire quel syntaxe utiliser pour définir par défaut la classe "en-cours" sur le lien "ACCUEIL". (En effet, je souhaiterai que, lorsqu'on arrive sur le site, la classe "en-cours" soit déjà active sur l'accueil.

Merci !
<ul class="nav">
	<li><a <?php if($_GET['page']=="accueil" || !isset($_GET['page']) echo 'class="en-cours"'; ?> href="index.php?page=accueil" target="_self">Accueil</a></li>
	<li><a <?php if($_GET['page']=="ceomusic") echo 'class="en-cours"'; ?> href="index.php?page=ceomusic">CEO Music</a></li>
	<li><a <?php if($_GET['page']=="artistes") echo 'class="en-cours"'; ?> href="index.php?page=artistes" target="_self">Artistes</a></li>
	<li><a <?php if($_GET['page']=="artistes") echo 'class="en-cours"'; ?> href="index.php?page=actualites" target="_self">Actualités</a></li>
	<li><a <?php if($_GET['page']=="actualites") echo 'class="en-cours"'; ?> href="index.php?page=agenda" target="_self">Agenda</a></li>
	<li><a <?php if($_GET['page']=="boutique") echo 'class="en-cours"'; ?> href="#" target="_self">Boutique</a></li>
</ul>
Sujet clos
Aller à