Discussion :

[jeyreem]

Bonjour,

Je vais essayer de vous expliquer le plus précisément mon problème, j'utilise des tabs pour une sidebar, des tabs avec jquery-ui, par dessus, j'ai des custom scrollbar qui s'ajoute, donc sur la premiere tabs (qui se load avec la page), je n'ai aucun souci, mais lorsque je change de tabs, ils n'ont pas le custom scrollbar.

Le custom scrollbar est un plugin jQuery. Mon code est celui-ci:

Code html :

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

1
2
3
4
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script language="JavaScript" type="text/JavaScript" src="js/jquery.mousewheel.js"></script> // les 2 scripts sont pour le custom scroll bar
<script language="JavaScript" type="text/JavaScript" src="js/jquery.jscrollpane.min.js"></script>

Code :

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

1
2
3
4
5
6
7
8
9
10
$(function() {
$( "#tabs" ).tabs();
});
$(function() {
    $('.contentActu').jScrollPane({
    horizontalGutter:5,
    verticalGutter:5,
    'showArrows': false
});
});

Code html :

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
<div id="sidebar">
	<div id="tabs">
		<ul>
			<li><a href="#tabs-1">Actualités</a></li>
			<li><a href="#tabs-2">Enchères</a></li>
			<li><a href="#tabs-3">Remerciements</a></li>
		</ul>
		<div id="tabs-1">
			<div class="contentActu">
				..
		</div>
		<div id="tabs-2">
			        ..
		</div>
		<div id="tabs-3">
			        ..
		</div>
	</div>
</div>

Je voulais donc savoir, comment faire pour faire apparaitre la custom scrollbar, comment refresh le JS afin de l'activer sur les autres tabs.

Merci d'avance, en espérant avoir été assez clair. Je suis une bille en JS

Cordialement,
Jeyreem

[SpaceFrog]

tes tabs sont chargés avec un load ?

appliques ton scrollbar sur le callback du load ...

[jeyreem]

Je ne comprends pas ta réponse, je suis vraiment débutant.. Pourrais tu développer un peu plus si ça ne te dérange pas ?

Désolé

[jeyreem]

J'ai changé de plugins, et il me semble que maintenant c'est dans un load:

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<script>
    (function($){
        $(window).load(function(){
            $(".contentActu").mCustomScrollbar({
                axis:"yx"
            });
        });
    })(jQuery);
</script>

Comment je dois faire maintenant ?

[SpaceFrog]

te renseigner sur le callback de load ...
là ou tu dois appliquer le plugin.

[jeyreem]

Voilà je me suis renseigner sur les callbacks, et mon code ressemble à ça maintenant (mais ne fonctionne tjrs pas )

Code :

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

1
2
3
4
5
6
7
 
$( "#tabs" ).tabs();
  $( "#tabs" ).click(function(){
            $(".contentActu").mCustomScrollbar({
                axis:"yx"
            });
    });

Mon appel en temps normal est celui-ci:

Code :

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

1
2
3
4
5
6
7
8
 
$(function($){
        $(window).load(function(){
            $(".contentActu").mCustomScrollbar({
                axis:"yx"
            });
        });
})(jQuery);

Au chargement, la scollbar n'est pas présente, normal, car je lui demande d’apparaître au clic, mais quand je clic sur les autres tabs, elle n’apparaît pas, cela ne fonctionne que sur la toute première tabs, celle qui apparaît au chargement..

[SpaceFrog]

ce n'est pas ce que je lis dans la doc ...
http://api.jquery.com/load/

Code :

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

.load( url [, data ] [, complete ] )

3 paramètres
complete =callback ...

[Bovino]

Vous ne parlez pas du même .load() !
Ceci dit, le gestionnaire d'événement étant déprécié, il ne devrait plus être utilisé (à remplacer par [codeinline].on('load', ...)[codeinline]).