Discussion :

[arnlig3550]

Bonjour à tous,

J'ai un soucis avec un action a déclencher sur un lien du type <a href="#"> voir les photos ...</a>

J'aimerais que ce lien déclencle la même action que le bouton "Photos" de mon menu, dont voici son code html :

Code html :

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

1
2
3
4
5
6
7
8
 
<nav>
        <a href="#accueil" rel="page-accueil" class="active">Accueil</a>
	<a href="#presentation" rel="page-presentation">Presentation</a>
	<a href="#photos" rel="page-photos">Photos</a>
	<a href="#plan" rel="page-plan">Plan d'accès</a>
	<a href="#contact" rel="page-contact">Contact</a>
</nav>

et son code JS :

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
 
var _is_animating_page = false;
	$('#header nav a').click(function() {
		if ($(this).hasClass('active') || _is_animating_page) return false;
 
		if ($(this).hasClass('none')) {
			document.location = $(this).attr('href');
			return false;
		}
 
		_is_animating_page = true;
 
		var div 			= '<div class="back-nav"></div>',
			_width 			= $(this).outerWidth(), 
			_height 		= $(this).outerHeight(), 
			_top 			= $(this).offset().top, 
			_left 			= $(this).offset().left,
			_rel 			= $(this).attr('rel'),
			_width_page 	= $(window).width(),
			_final_width 	= ($(this).index() > $('#header nav a.active').index()) ? _width_page : -_width_page;
 
		$('#header nav a.active').removeClass('active');
		$(this).addClass('active');
 
		$('body').css({'overflow':'hidden'});
 
		$('.page.active').css({'position':'absolute', 'width':'100%'}).animate({left:'-='+_final_width}, 500, 'easeInExpo', function() {
			$('.page.active').css({'position':'relative', 'width': 'auto', 'left': 'auto'}).removeClass('active').hide();
			$('#'+_rel).addClass('active').show().css({'position':'relative', 'width':'100%', 'left': _final_width}).animate({left:0}, 500, 'easeOutExpo', function() {
				$('body').css({'overflow':'auto'});
				_is_animating_page = false;
			});
		});
 
		return false;
	});

J'ai essayé de remettre le même code à mon lien comme au bouton du menu, cet à dire :

Code :

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

<a href="#photos" rel="page-photos"> voir les photos ...</a>

Mais ça ne fonctionne pas, et j'ai essayé la fonction trigger comme ceci:

Code :

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

1
2
3
4
5
 
$('#news2 p a').click(function() {
		$('#header nav a[rel="page-photos"]').trigger('click');
		return false;
	});

Mais ça ne fonctionne pas non plus, l'ai-je bien écris ?

Quelqu'un peut-il m'aider à résoudre ce problème ?

Merci

[SpaceFrog]

rajoute un preventDefault()?

[arnlig3550]

Salut,

Merci pour ta réponse, mais où est ce que je met ce code ? ^^
Je suis débutant et j'ai du mal avec le JS ^^

[SpaceFrog]

commence par mettre preventDefault() dans la zone de saisie sur la page de google ?

[arnlig3550]

Oui c'est ce que j'ai fais ne vous inquiétez pas ^^ mais j'ai du mal à comprendre le rapport de cette option et ce que je souhaite faire

Pouvez vous m'expliquez comment procéder ?

est ce que le code ci-dessous est bon déja ? ^^

Code :

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

1
2
3
4
5
 
$('#news2 p a').click(function() {
	$('#header nav a[rel="page-photos"]').trigger('click');
	return false;
});

[SpaceFrog]

un click sur un lien si il n'est pas inhiber lancera le href ...
il faut inhiber le href !

soit pas un return false comme dans ton dernier code ...
ou de préférence avec un preventDefault().

[arnlig3550]

j'ai donc essayé ça :

Code :

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

1
2
3
4
5
 
$('#news2 p a').click(function() {
	$('#header nav a[rel="page-photos"]').trigger('click');
	preventDefault();
});

mais ça fonctionne pas, je vois juste le lien du href qui s'ajoute dans la barre d'adresse, mais c'est tout