fermer un ensemble de div sur un clic dans le doc

**airod** · 15/12/2009, 11h36

bonjour, je cherche a attribuer a tous les éléments d'un document l'action de fermeture d'un ensemble de div (meme class) sauf, sur certain éléments.
j'ai essayé plusieurs chose mais rien n'y fait.
est ce que quqelqu'un peut m'aider, svp.

merci d'avance

**danielhagnoul** · 15/12/2009, 22h59

Bonsoir.

Question non triviale ! Voici un exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="Author" content="Daniel Hagnoul" />
	<title>Page type</title>
	<style type="text/css">
		body {
			background-color:#FFFFFF;
			color:#000000;
			font-family:Arial, Helvetica, sans-serif;
			font-size:medium;
			font-style:normal;
			font-weight:normal;
			line-height:normal;
			letter-spacing:normal;
		}
		h1,h2,h3,h4,h5 {
			font-family:"Times New Roman", Times, serif;
		}
		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img {
			margin:0px;
			padding:0px;
		}
		p {
			padding:6px;
		}
		ul,ol,dl {
			list-style:none;
			padding-left:6px;
			padding-top:6px;
		}
		li {
			padding-bottom:6px;
		}
		div#conteneur {
			width:95%;
			margin:12px auto;
			padding:6px;
			background-color:#FFFFFF;
			color:#000000;
			border:1px solid #666666;
			font-size:0.8em;
		}
 
		/* TEST */
		.uneClasse {
			width:200px;
			height:50px;
			margin:12px;
			background-color:#ffddff;
		}
		.autreClasse {
			background-color:#cccccc;
		}
	</style>
	<script type="text/javascript" src="../lib/jquery-1.3.2.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$("*", document.body).click(function(){
				if (!$(this).hasClass("uneClasse")){
					$(".uneClasse").not(".autreClasse").css("display","none");
				}
 
				return false;
			});
		});
	</script>
</head>
<body>
	<div id="conteneur">
		<div class="uneClasse autreClasse"></div>
		<div class="uneClasse"></div>
		<div class="uneClasse autreClasse"></div>
		<div class="uneClasse"></div>
	</div>
</body>  
</html>

**airod** · 17/12/2009, 14h39

si je comprend bien le code, ca ferme toutes les divs sauf certaines.

moi ce que j'essaie de faire c'est attribuer a tous les éléments du body la fermeture d'ensemble de div, sauf sur certains élément qui ne doivent pas provoquer la fermeture des divs.

c'est légèrement différent.
mais l'exemple de danielhagnoul est intéressant.

merci.

**danielhagnoul** · 17/12/2009, 20h31

Bonsoir.

L'exemple ferme uniquement les divisions ayant la classe « uneClasse », sauf les divisions qui ont en plus la classe « autreClasse ». Si vous rajouter des divisions (avec ou sans classes portant un autre nom qu’« uneClasse »), elles ne seront pas fermées.

fermer un ensemble de div sur un clic dans le doc

jQuery

Vue hybride

Discussions similaires

Partager

Partager