Cibler des élément Jquery

Résolu

gintoxic Messages postés 524 Date d'inscription Statut Membre Dernière intervention -
gintoxic Messages postés 524 Date d'inscription Statut Membre Dernière intervention - 2 sept. 2013 à 20:38

bonjour,
je tache de faire un menu de 7 items qui doivent chacun faire apparaitre une div qui va recevoir un sous-menu respectif (certainement créé en PHP) ...

auriez vous de l'aide à me fournir svp ?

j'ai testé avec

if(event.target = this)

mais rien à faire

bien entendu si vous avez l'explication avec votre aide je suis TRES preneur afin de comprendre et e pas faire betement du code

merci à vous

A voir également:

Cibler des élément Jquery
Open element - Télécharger - HTML
Élément introuvable impossible à supprimer - Guide
Impossible de copier car cet élément est trop volumineux pour le format du volume. ✓ - Forum MacOS
Impossible d'ajouter un élément au modèle instagram ✓ - Forum Samsung
Impossible de copier car cet élément est trop volumineux pour le format du volume ✓ - Forum MacOS

1 réponse

Réponse 1 / 1

prosthetiks Messages postés 1189 Date d'inscription Statut Membre Dernière intervention 431

Hello,

Voici une liste de menus css3.

https://www.smashingapps.com/2012/03/14/40-excellent-css3-menu-tutorials.html

Tu devrais y trouver ton bonheur, sinon merci de préciser tes besoins.

++

gintoxic Messages postés 524 Date d'inscription Statut Membre Dernière intervention 10

beh j'ai des div id qui ont le meme nom de classe et je voudrais par exemple changer la couleur de fond de chacun d'entre eux au survol de la souris sans que ca ne change celle des autres

prosthetiks Messages postés 1189 Date d'inscription Statut Membre Dernière intervention 431

dans ce cas là, assigne leur une seconde classe distincte:

<div class="submenu submenu-red"></div>
<div class="submenu submenu-blue"></div>

et en css:

.submenu{
width: ...px;
height: ...px;
// Suite du code identique pour tous les sous-menus
}

.submenu-blue{
background-color: blue;
}
.submenu-red{
background-color: red;
}

gintoxic Messages postés 524 Date d'inscription Statut Membre Dernière intervention 10

la couleur était un exemple bien entendu mais là il s'agit de coder en jquery pour que chacun de ces items de menus serve de trigger pour afficher des sous menus dans une div... distant mais sur la meme page

prosthetiks Messages postés 1189 Date d'inscription Statut Membre Dernière intervention 431

re, qqch dans le genre ?

<html>
<head>
	<title></title>
	<style type="text/css">
		html, body{
			padding:0;
			margin:0;
			height: 100%;
		}
		#firstLevelMenu ul li{
			display: inline;
		}
		#firstLevelMenu{
			width: 100%;
			height: 30px;
			text-align: center;
			background-color: red;
		}
		#secondLevelMenu{
			position: absolute;
			bottom:100px;
			width: 100%;
			height: 0;
		}
		.submenu{
			width: 100px;
			float: left;
			visibility: hidden;
			transition: all linear .3s;
		}
		.submenu.active{
			display: block;
			visibility: visible;
			height: 100px;
			background-color: red;
		}
	</style>
</head>
<body>
	<nav id="firstLevelMenu">
		<ul>
			<li><a href="#">Sous-menu1</a></li>
			<li><a href="#">Sous-menu2</a></li>
			<li><a href="#">Sous-menu3</a></li>
			<li><a href="#">Sous-menu4</a></li>
			<li><a href="#">Sous-menu5</a></li>
		</ul>
	</nav>

	<nav id="secondLevelMenu">
		<div class="submenu active">Sous menu1</div>
		<div class="submenu">Sous menu2</div>
		<div class="submenu">Sous menu3</div>
		<div class="submenu">Sous menu4</div>
		<div class="submenu">Sous menu5</div>
	</nav>


	<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
	<script type="text/javascript">
		$('#firstLevelMenu a').click(function(e){
			e.preventDefault();
			var index = $(this).parent().index();
			$('.submenu').removeClass('active');
			$($('.submenu').get(index)).addClass('active');
		});
	</script>
</body>
</html>

gintoxic Messages postés 524 Date d'inscription Statut Membre Dernière intervention 10

merci à toi pour ce script, mais et j'insiste là dessus, je voudrais bien le comprendre.
aussi pourrais-tu détailler stp le JS que j'assimile

merci à toi ceci dit

ps : je rappelle que les sous-menus sont créés en php a part sur des feuilles sur le serveur

Discussions similaires

Comment "inspecter l'élément" sur Mac ?

Impossible de copier car cet élément est trop volumineux

Mettre le menu Inspecter l’élément en bas

inspecter macbook

vous ne disposez pas des autorisations...

Votre réponse

Discussions similaires