Cibler des élément Jquery

Résolu/Fermé

gintoxic Messages postés 524 Date d'inscription mardi 31 juillet 2007 Statut Membre Dernière intervention 7 avril 2016 - 1 sept. 2013 à 01:42
gintoxic Messages postés 524 Date d'inscription mardi 31 juillet 2007 Statut Membre Dernière intervention 7 avril 2016 - 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
Supprimer élément introuvable - Guide
Désolé. vous ne pouvez pas accéder à cet élément, car il ne respecte pas nos conditions d'utilisation. ✓ - Forum Cloud
Comment ajouter un élément dans une liste déroulante excel - Guide
Inspecter l'élément mac - Forum MacOS

1 réponse

Réponse 1 / 1

prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
1 sept. 2013 à 22:36

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 mardi 31 juillet 2007 Statut Membre Dernière intervention 7 avril 2016 10
1 sept. 2013 à 23:57

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 dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
2 sept. 2013 à 00:01

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 mardi 31 juillet 2007 Statut Membre Dernière intervention 7 avril 2016 10
2 sept. 2013 à 00:09

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 dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
2 sept. 2013 à 00:19

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 mardi 31 juillet 2007 Statut Membre Dernière intervention 7 avril 2016 10
Modifié par gintoxic le 2/09/2013 à 00:59

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

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

Comment inspecter l'élément sur mobile ?

[PYTHON] Récupérer position dans liste

vous ne disposez pas des autorisations...

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