Alterner hide et show

**dominos** · 10/11/2011, 21h41

Bonsoir,

je cherche à alterner (show/hide) l'affichage d'une div par l'évenement mousedown d'une image bouton.

j'ai l'impression de tourner en rond

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
window.onload = function() {
 
	var selectContainerList = $('#select_list'); // div (show/hide)
	var selectContainerBtn = $('#select_btn'); // img bouton
 
	$(selectContainerBtn).mousedown(function() {
 
		var selecIsFocus = false;
 
		if (selectContainerList.hide()||(selecIsFocus!=true)) {
			selectContainerList.show();
			selecIsFocus = true;	
		}
		else if (selectContainerList.show()||(selecIsFocus!=true)) {
			selectContainerList.hide();
 
		}
 
	});
 
};

**Golgotha** · 10/11/2011, 22h05

Bonsoir,

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
<html>
 <head>
 <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
 
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.min.js"></script>
  <script type="text/javascript">
 
 
     $(document).ready(function() {
  		$("#image").click(function () { 
      		$("#texte").is(":visible") ? $("#texte").hide() : $("#texte").show();
    		});
 		});
 
  </script>
 </head>
 <body>
 
 
 	<img id="image" src="http://www.lesite.com/telechargements/photos/44857_bestiole.png">
 	<div id="texte">
 
Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression. Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un peintre anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte. Il n'a pas fait que survivre cinq siècles, mais s'est aussi adapté à la bureautique informatique, sans que son contenu n'en soit modifié. Il a été popularisé dans les années 1960 grâce à la vente de feuilles Letraset contenant des passages du Lorem Ipsum, et, plus récemment, par son inclusion dans des applications de mise en page de texte, comme Aldus PageMaker.
 
 	</div>
 
 </body>
</html>

**dominos** · 10/11/2011, 22h16

merci ça fonctionne impecable avec ce ternaire...

Code :

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

1
2
selectContainerList.is(":visible")?selectContainerList.hide()
:selectContainerList.show();

**Bovino** · 10/11/2011, 22h20

Une aversion pour toggle() ?

**Golgotha** · 10/11/2011, 22h26

Envoyé par Bovino

Une aversion pour toggle() ?

C'est moi le plus beau c'est tout

**Bovino** · 10/11/2011, 22h34

Envoyé par Golgotha

C'est moi le plus beau c'est tout

Mouais... sauf que ta solution n'est valable que si les id sont uniques dans la page !

**Bovino** · 10/11/2011, 22h08

Beaucoup de choses à redire...

Code :

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

window.onload = function()

Tu devrais commencer par les fondamentaux : $.ready()...

Code :

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

1
2
var selecIsFocus = false;
	if (selectContainerList.hide()||(selecIsFocus!=true))

Tu peux expliquer à quoi sert cette condition ???

Puisque tu viens d'affecter à selecIsFocus la valeur false, comment pourrait-elle ne pas être différente de true

D'autre part, quel est selon toi l'équivalent booléen de selectContainerList.hide() ?

Enfin bref... en plus simple :

Code :

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

1
2
3
4
5
$(function(){
    $('#select_list').mousedown(function(){
        $('#select_btn').toggle();
    });
});

**dominos** · 10/11/2011, 22h22

Envoyé par Bovino

Enfin bref... en plus simple :

Code :

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

1
2
3
4
5
$(function(){
    $('#select_list').mousedown(function(){
        $('#select_btn').toggle();
    });
});

fonctionne très bien aussi avec toggle();

que fait exactement cette fonction ?

**dominos** · 10/11/2011, 22h26

merci g trouvé la doc : http://jquery.jarodxxx.com/manuel/Le...ements/toggle/

je suis pas expert dans ces domaines j'apprend sur le tas.

merci pour ces conseils

Alterner hide et show

jQuery

Vue hybride

Discussions similaires

Partager

Partager