Les liens de mon menu ne fonctionne pas (javaScript, Html)

Bonjour, alors voila j'ai créer un menu qui est dynamique a chaque clique le bouton actif ce dépasse et en effet il se trouve que le problème vient de là car en faisant des test les liens ne marche que quand j'enlève un bout de code JAVASCRIPT mais ce bout de code permet de dynamisé mon menu je veux donc pas le supprimer, je sais pas du tout comment faire ;( si vous avez une idée de comment je peux avoir et mon menu dynamique et mes liens qui fonctionne ou bien si il ya une autre solution d'appeler une autre page a l'aide de lien cacher (php, html, javascript,css ..)
je vous met mon code html ci dessous et le java script par la suite
HTML:

<nav class="tabs"> 			
				<div class="selector"></div>
				<a href="../pages/accueil.php" class="active"><i class="fas fa-broadcast-tower fa-lg"></i> Accueil </a>				
				<a href="../pages/nouvelleActivite.php"><i class="fas fa-th-list fa-lg"></i> Toutes Les Activités </a>
				<a href="#"><i class="fas fa-pencil-alt fa-lg"></i> Nouvelle Activité </a>
				<a href="#"><i class="fas fa-chart-bar fa-lg"></i> Statistique </a>
				<a href="../index.php"><i class="fas fa-user-slash fa-lg"></i> 
                               Déconnexion </a>
</nav>

code JAVASCRIPT :

<script>
	var tabs = $('.tabs');
	var selector = $('.tabs').find('a').length;
	var selector = $(".tabs").find(".selector");
	var activeItem = tabs.find('.active');
	var activeWidth = activeItem.innerWidth();
	$(".selector").css({
	  "left": activeItem.position.left + "px", 
	  "width": activeWidth + "px"
	});

	$(".tabs").on("click","a",function(e){	 
	  e.preventDefault();	  
	  $('.tabs a').removeClass("active");	  
	  $(this).addClass('active');	  
	  var activeWidth = $(this).innerWidth();	 
	  var itemPos = $(this).position();	  
	  $(".selector").css({		 
		"left":itemPos.left + "px", 		 
		"width": activeWidth + "px"		
	  });
	});
</script>	

Salut,

Il y a quelques incohérences dans ce que tu tentes de faire.

On commence par le fait que les liens ne sont plus cliquables. Est-ce que tu as un idée de pourquoi tu as mis ça :

e.preventDefault();

J'imagine que non

W3Schools a écrit :
The preventDefault() method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur.
For example, this can be useful when:
- Clicking on a "Submit" button, prevent it from submitting a form
- Clicking on a link, prevent the link from following the URL

https://www.w3schools.com/jsref/event_preventdefault.asp
Donc effectivement quand tu clic sur un lien ca empêche d'ouvrir le lien.

Ensuite, a plus haut niveau, tu le remarqueras par toi même je pense mais une animation Js sur un menu avec des liens c'est un peu incompatible... quand tu auras résolu ton soucis tu verras qu'au clic sur un lien ta page va changer / se recharger sans faire attention à l'animation (donc avant, pendant ou après l'animation si elle est rapide) et sans garder l'état du menu sur la nouvelle page (il se remettra a 0 d'un coup vu que la page se recharge).
Pour avoir un menu animé en JS il faut que le changement de page se fasse également en Js et sans reload de la page entière, c''est un peu plus compliqué a faire.

Bonne journée

Salut,

LenaMora a écrit :
où est-ce que je dois mettre mes liens en js ?

Je suis désolé mais je ne suis pas sur de comprendre cette question.. qu'est-ce que tu appelles des "liens en Js" ? Tu veux parler d'un changement de page en Js sans recharger la page comme j'ai suggéré ? Si c'est ça, comme je l'ai dit dans ma réponse, c'est "un peu plus compliqué" et c'est un euphémisme j'ai envie de dire. Ca implique beaucoup de changements par rapport a un site "normal". Et ca peut aller plus ou moins loin techniquement, le plus basique étant d'avoir tout le contenu dans 1 seule page et masquer/afficher les sections en Js grâce au menu (et toutes les contraintes que ca entraine si on rajoute pas plus de code : pas d'url différentes, SEO qui peut en prendre un coup, accessibilité, etc...).

En gros, pour moi, pour un site internet basique et sans connaissances poussées c'est une mauvaise idée de s'embarquer la dedans juste pour avoir des animations. Mais bon, je l'ai déjà fait sur mes premiers sites hein

Ou alors passer sur un site dit "one page" qui va scroller à la bonne section plutôt que changer de page et là tu pourra avoir des animations sur ton menu sans changer de page et sans pour autant avoir besoin de trop de "gestion" autour.