Bonjour,
J'ai un système de navigation par onglets à l'intérieur desquels il y a des carrousels animés par le plugin carouFredSel.
Mais seul le carrousel de l'onglet actif au chargement (ou au rafraîchissement) de la page est affiché,
et si je clique sur un autre onglet, j'ai pas de carrousel.
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
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
	<link href="style_onglets.css" rel="stylesheet" type="text/css"  />
	<link href="style_caroufredsel.css" rel="stylesheet" type="text/css"  />
	<script src="jquery-1.10.1.min.js" type="text/javascript" ></script> 
	<script src="onglets.js" type="text/javascript" ></script>
	<script src="jquery.carouFredSel-6.2.1.js"type="text/javascript" ></script>
	<script>
		$(function() {
			$('#foo1').carouFredSel({
				prev: '#prev1',
				next: '#next1',
				pagination: "#pager1"
			});
			$('#foo2').carouFredSel({
				prev: '#prev2',
				next: '#next2',
				pagination: "#pager2"
			});
		});
 
	</script>  
 
</head>
<body >
	<div class="bloc">
		<div class="title">
			<div class="tabs" id="tabs1">
				<a href="#onglet1">vidéos</a>
				<a href="#onglet2">Photo-galeries</a>
			</div>
		</div>
		<div class="content">
			<div id="onglet1">
				<div class="wrapper">
					<div class="list_carousel">
						<ul id="foo1">
							<li><img src="pix/01.png"></li><li><img src="pix/02.png"></li>
							<li><img src="pix/03.png"></li><li><img src="pix/04.png"></li>
							<li><img src="pix/05.png"></li><li><img src="pix/06.png"></li>
						</ul>
						<div class="controls_slide">
							<a id="prev1" class="prev" href="#"> << </a>
							<a id="next1" class="next" href="#"> >> </a>
							<div id="pager1" class="pager"></div>
						</div>
					</div>
				</div>
			</div>
			<div id="onglet2">
				<div class="wrapper">
					<div class="list_carousel">
						<ul id="foo2">
							<li><img src="pix/07.png"></li><li><img src="pix/08.png"></li>
							<li><img src="pix/09.png"></li><li><img src="pix/10.png"></li>
							<li><img src="pix/11.png"></li><li><img src="pix/12.png"></li>
						</ul>
						<div class="controls_slide">
							<a id="prev2" class="prev" href="#"> << </a>
							<a id="next2" class="next" href="#"> >> </a>
							<div id="pager2" class="pager"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
 
</body>
</html>
Le js des tabs:
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
jQuery(function($){
	var anchor = window.location.hash;
	$('.tabs').each(function(){
		var current = null;
		if(anchor !='' && $(this).find('a[href="'+anchor+'"]').length > 0){
			current = anchor;
		}else{
			current = $(this).find('a:first').attr('href');
		}
		$(this).find('a[href="'+current+'"]').addClass('active');
		$(current).siblings().hide();
		$(this).find('a').click(function(){
			var link = $(this).attr('href');
			if(link == current){
				return false;
			}else{
				$(this).siblings().removeClass('active');
				$(this).addClass('active');
				$(link).show().siblings().hide();
				current = link;
			}
		});
	});
});
Aucune erreur n'est visible sur la console de firebug.
Quelqu'un peut-il m'aider?
Merci.