2010-09-07 11 views
0

J'ai défilement avec le plugin de navigation et l'histoire définie sur true. Cela permet aux utilisateurs d'utiliser les liens id'd pour faire défiler la sélection de leur choix dans la liste déroulante (environ 50 éléments). J'ai circulaire mis à vrai. Les éléments s'affichent par groupes de 4. Mais les boutons précédent et suivant se déplacent d'un seul élément, alors que je veux qu'ils se déplacent de 4 éléments. Comment puis-je faire cela?Jquery Tools & Scrollable

Je ne peux pas les grouper dans des pages div puisque la liste des onglets indexés correspond alors à ces pages div plutôt qu'aux éléments contenus.

J'ai essayé de créer un gestionnaire de clic avec api.move (-2), mais toutes sortes de choses étranges se produisent (ne pas préempter natif scroll-by-one, rembobine au lieu d'avancer, avance et rembobine dans une séquence - pas acceptable).

Il me manque évidemment quelque chose de basique. Les pointeurs seraient appréciés.

Merci,

  • Henrik

Répondre

1

Voici ce que je fini par faire: J'ai attrapé le api et remplacé les fonctions suivantes et prev; circulaire désactivée; ajouté les premier et dernier boutons. Une sorte de solution de contournement/semi-solution. Vous pouvez voir le résultat à http://cityrinks.ca/wiki/wiki.php?n=ListOfRinks.TableOfRinks

$(function() { 
$(".scrollable") 
    .scrollable({ 
     vertical: true, 
     mousewheel: true, 
     circular:false 
    }) 
    .navigator({ 
    navi: "#rinktabs", 
    naviItem: 'a', 
    activeClass: 'current', 
    history: false 
     }); 
var api = $(".scrollable").data("scrollable"); 
api.next = function(time) { 
index = this.getIndex(); 
size = this.getSize(); 
interval = size - index; 
if (interval > 4) interval = 4; 
return this.move(interval, time); 
}; 
api.prev = function(time) { 
index = this.getIndex(); 
if (index > 4) index = 4; 
return this.move(-index, time); 
}; 
$("#firstbutton").click(function() { 
var api = $(".scrollable").data("scrollable"); 
return api.begin(api.speed); 
}); 
$("#lastbutton").click(function() { 
var api = $(".scrollable").data("scrollable"); 
return api.end(api.speed); 
}); 
});