11522 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Fermeture d'un menu au clic

Bonjour,
Je suis actuellement en train de développer un site en responsive pour la première fois.
Je suis en même temps une sorte de tuto sur youtube et je suis face un problème.
j'ai déjà cherché sur internet mais rien y fait.
j'ai un menu caché avec une icone, quand je clique une fois le menu apparaît mais impossible de le ferme quand je re-clique sur l'icone, j'ai cherche un peu de tout mais rien y fait.
auriez vous une idée du problème ?
j'utilise bootstrap, jquery, font-awesome
Bien Cordialement à vous
voici le code de Javascript :
//Document JavaScript

$(document).ready(function(){			  
	$('i.icon').click(function(){
	
		$('.nav-list').slideToggle()
	});		  			  
})




<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Printing3D - Index</title>

		<!--Font-->
		<link href="https://fonts.googleapis.com/css?family=Quattrocento+Sans" rel="stylesheet">
		<!--CSS-->
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
		<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
		<link rel="stylesheet" type="text/css" href="css/style.css">
	</head>
	<!-- Contenu du site -->
	<body>
		<!-- Debut En tête-->
		
		<header class="container-fluid header">
			<div class="container">
				<div class="row">
					<!-- Barre icone menu -->
					<i class="icon fa fa-bars fa-2x"></i>
					
					<!-- Logo -->
					<div class="col-md-3 col-xs-12">
						<div class="logo">
							<h2>Logo</h2>
						</div>
					</div>
					
					<!-- Nav -->
					<nav class="col-md-9 col-xs-12">
						<ul class="nav-list">
							<li class="list"><a href="#">Accueil |</a></li>
							<li class="list"><a href="#">Produits Phares | </a></li>
							<li class="list"><a href="#">Accueil</a></li>
							<li class="list"><a href="#">Accueil</a></li>
						</ul>
					</nav>
					
				</div>
	
			</div>
		</header>
		<!-- Fin En tête-->
		
		
		<h1>TEST BOOTSTRAP</h1>
		<!-- Script JS-->
		<script type="text/javascript" src="js/jqueryv3.3.1.js"></script>
		<script type="text/javascript" src="js/mainJs.js"></script>
		<script type="text/javascript" src="js/bootstrap.min.js"></script>
		<!-- Fin Script JS-->
	</body>
</html>


je m'excuse d'avance si il y a des erreurs >.<
Modifié par NenoLucia (10 Mar 2019 - 16:42)
Bonjour,

non il n'y avait rien dans la console,
j'ai essayé de refaire le même code avec le menu déroulant que j'ai rajouté et ce matin j'ai encore essayé et ça a marché Smiley eek , j'avais pourtant vider le cache etc etc mais bon hier ça ne voulais vraiment pas fonctionner Smiley sweatdrop .

Merci en tout cas d'avoir répondu et désole du dérangement car au final c'étais bon >.<

Bonne journée !
Sujet clos
Aller à