Frage

Ich versuche jQuery.scrollTo Plugin mit Akkordeon zu verwenden (wobei ein Block nach dem Anklicken er sich ausdehnt und weitere Verträge), aber es bewegen sich nicht auf die richtige Position.

Hier ist eine Demo: pelmeshkin.com/temp/scrolltoaccoridon

Wie Sie sehen können, werden die ersten Klick scrollt richtig, aber jeder nächste geht weiter als es sollte.

Es scheint Ziel der Ausgangsposition zu nutzen (wo sie vor der Expansion / Kontraktion waren), was Sinn macht, da beiden Ereignisse zur gleichen Zeit initiiert werden, aber selbst wenn ich versuche, scrollTo zu anhalten und warten, bis die slideUp / slidedown Übergang vorbei ist, ist es immer noch die gleiche verhält. : (

War es hilfreich?

Lösung 2

Ok, ich gelöst Art es selbst. Ich erste Positionen aller anklickbare Elemente auf Pageload finden unter Verwendung von Offset (), rüstete sich, und dann füttern diese als Pixelwerte zu scrollTo auf Click-Ereignis.

So können wir scrollTo genaue Pixelpositionen sind zu geben auf der Seite navigieren Sie zu, anstatt sich auf sie verlassen sie von selbst von Element-ID zu berechnen. Hier ist, wie es am Ende aussieht: pelmeshkin.com

Andere Tipps

Weil es die Position auf dem ortsbezogene Berechnung, bevor die Animation stattfindet. Nicht sicher, wie Sie über den Umgang mit dieser gehen würde, um ehrlich zu sein, außer vielleicht mit dem internen berechnen zu basteln, die wahrscheinlich keine einfache Angelegenheit ist.

Geck. N.S.F.W.

Und nach einem bisschen Hacking um auf 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); }}

Und dann an anderer Stelle ...

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

Frohes neues Jahr.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top