2010-08-15 4 views
1

Je ne sais pas s'il s'agit d'un bug ou non, mais voici mon problème: je filtre le contenu de jcarousel en utilisant jquery. Tout va bien jusqu'à ce que je commence à utiliser les boutons suivants/prev. Sur l'étape par défaut du filtrage, les boutons fonctionnent bien, mais une fois que j'ai commencé à filtrer le contenu (les images), les jcarousel commencent à travailler tous de fous. Par exemple, si j'ai 10 images dans l'état par défaut, montrant 3 sur scène, après le filtrage (disons que je n'ai que 4 maintenant) si j'arrive à la dernière image, le bouton suivant est encore activé et je peux défiler 10-15px zone même il n'y a que l'espace vide.Filtre jcarousel content

Les images supprimées par le filtre sont extraites par l'animation fadeOut.

J'ai essayé d'appeler le jcarousel après chaque action de filtrage mais j'ai obtenu le même résultat. Dans certains cas, après avoir appliqué le filtre, le prev btn. ce n'est pas activé mais je peux faire défiler 100-200px de l'espace vide.

J'ai essayé de résoudre ce problème au cours des 3 derniers jours, mais je n'ai pas trouvé la bonne solution.

Désolé pour mon anglais et merci :-)

Mise à jour:

Voici mon code peut-être qu'il va comprendre le problème:

$(".anim").jcarousel(); 
$("#menu ul li").click(function() { 
    var flt = $('a', this).attr('rel'); 
    $('.anim li').each(function() { 
     if(!$(this).hasClass(flt)) { 
      $(this).fadeOut('normal'); 
     } else { 
      $(this).fadeIn('normal'); 
      } 
     }); 
    return false; 
}); 

La structure jCarousel (.anim) est:

<ul class="anim"> 
<li class="flt1"><img ... /></li> 
<li class="flt1"><img ... /></li> 
<li class="flt1"><img ... /></li> 
<li class="flt2"><img ... /></li> 
<li class="flt3"><img ... /></li> 
</ul> 

Où flt1..3 sont mes filtres et la valeur 'rel' des liens de menu. Le filtrage fonctionne bien.

Répondre

1

Vous devez indiquer explicitement à jCousous le nombre d'éléments qui restent.

Par exemple, voici une fonction anonyme que je donne à la config de jCarousel

function(carousel, state) { 

       if (state != 'init') return; 

       getProperties(function(properties) { 
        $.each(properties, function(i, property) { 
         carousel.add(i + 1, getPropertyHtml(property)); 
        }); 

       carousel.size(properties.length); 



       }); 

      } 

Remarquez comment à la fin, je dois définir la taille? Ce que vous devez faire est de trouver un rappel approprié dans le configuration, puis définissez la nouvelle longueur des éléments.

+0

Merci pour votre réponse Alex. J'ai posté mon code parce que je ne peux pas le faire fonctionner. Pourriez-vous m'aider avec ce petit problème? – doubleb

+0

Un problème avec la définition de la taille lorsque vous masquez simplement des éléments dans jCousel est que si vous redimensionnez le carrousel (comme lorsque le navigateur redimensionne), il supprime les éléments avec un indice supérieur à la taille. Cela peut causer de gros problèmes. –