scrollTo ne défile pas à la bonne position

Question

Je suis en train d'utiliser le plugin jQuery.scrollTo avec accordéon (où un bloc se développe après avoir cliqué sur dessus et un autre contrat), mais il ne défile pas à la bonne position.

Voici une démo: pelmeshkin.com/temp/scrolltoaccoridon

Comme vous pouvez le voir, les premiers rouleaux clic correctement, mais chaque suivant va plus loin que prévu.

Il semble utiliser la position initiale de la cible (où il était avant l'expansion / contraction), ce qui est logique, puisque les deux événements sont initiés en même temps, mais même lorsque je tente de faire une pause scrollTo et attendre jusqu'à ce que le slideUp / slideDown transition est terminée, il se comporte toujours le même. : (

Answer 1

Ok, je sorte de moi-même résolu. Je trouve d'abord les positions de tous les éléments cliquables sur pageload en offset (), les rangea, puis nourrir ceux-ci comme des valeurs de pixel à scrollTo sur événement click.

De cette façon, nous offrons scrollTo position exacte de pixels pour faire défiler la page, plutôt que de compter sur elle pour le calculer à partir ID d'élément lui-même. Voici à quoi il ressemble à la fin: pelmeshkin.com

Answer 2

Parce qu'il est le calcul de la position en fonction de l'emplacement avant que l'animation se produit. Je ne sais pas comment vous y prendriez faire face à ce pour être honnête, sauf peut-être bricoler avec le calcul interne qui est probablement pas une mince affaire.

Answer 3

Mec. N.S.F.W.

Et après un peu de piratage autour de Effect.ScrollTo:

Effect.LazyScrollTo = function(element) { try {
  var options = arguments[1] || { };
  scrollOffsets = document.viewport.getScrollOffsets();
  elementOffsets = $(element).cumulativeOffset();

  if (options.offset) elementOffsets[1] += options.offset;

  return new Effect.Tween(null,
    scrollOffsets.top,
    elementOffsets[1],
    options,
    function(p){
      try {
        this.lazy_offset = this.lazy_offset || $(element).cumulativeOffset();
        scrollTo(scrollOffsets.left, (p.round() - (elementOffsets[1] - this.lazy_offset[1])));
      } catch(e) {
        alert(e);
      }
    }.bind(this)
  ); 
} catch(e) { alert(e); }}

Et puis ailleurs ...

new Effect.SlideDown('tab1-body', {queue: 'end'});
new Effect.LazyScrollTo('tab1-heading', {queue: 'end'});

Bonne année.