Scrollen, um ein element innerhalb eines div

Habe ich einen absolut positionierten div-Element, das als modales Fenster, in der Mitte der Seite. Das modale Fenster ist vertikal Scrollbar mit einem scroll-Leiste auf der rechten Seite. Die Seite selbst ist auch vertikal Scrollbar mit einem scroll-Leiste auf der rechten Seite.
Ich würde gerne in der Lage, auf einen link zu klicken und die modalen Fenster navigieren Sie zu dem verknüpften Element.

Kann ich ziemlich viel erreichen mit diesem Ziel.scrollIntoView(); sondern die gesamte Seite scrollt zusammen mit dem modalen Fenster - ich möchte es so die Seite nicht bewegen und haben nur die modalen Fenster navigieren.
Wenn ich scrollIntoView(false) die Seite nicht scrollen, während das modale Fenster nicht, aber das target-element ist am unteren Rand des Fenster, während ich, wie es an der Spitze.

Gibt es eine Möglichkeit, ich kann manuell den Versatz der position des Ziels innerhalb der div? d.h. wenn ich scrollIntoView(false), wird das Ziel nicht angezeigt wird am unteren Rand des div - wenn dann könnte ich es ausgleichen, indem Sie die Höhe der Ansicht ein Fenster, ich sollte in der Lage sein, um es in die top..?

Hinweis: ich kann nicht mit JQuery oder ähnliches für diese.

Vielen Dank im Voraus für jede Hilfe.

InformationsquelleAutor thor | 2010-09-16
  1. 5

    Hier eine live-demo, die ich denke, nicht, was Sie suchen: http://jsfiddle.net/QN3mK/

    Den code, es zu tun, ist dies: (meist überprüfen Sie die scrollFunc() Funktion)

    function scrollFunc() {
    var est = document.getElementById('est');
    var docPos = f_scrollTop();
    est.scrollIntoView();
    window.scrollTo(0,docPos);
}

function f_scrollTop() {
    return f_filterResults (
        window.pageYOffset ? window.pageYOffset : 0,
        document.documentElement ? document.documentElement.scrollTop : 0,
        document.body ? document.body.scrollTop : 0
    );
}

function f_filterResults(n_win, n_docel, n_body) {
    var n_result = n_win ? n_win : 0;
    if (n_docel && (!n_result || (n_result > n_docel)))
        n_result = n_docel;
    return n_body && (!n_result || (n_result > n_body)) ? n_body : n_result;
}

    Den zweiten zwei Funktionen sind nur ein cross-browser-kompatiblen Art und Weise, die ich fand, immer die aktuelle scroll-position der Seite. Also, was dies tut, ist zu finden ein element (vermutlich in scrollbaren div-Element), wird die aktuelle scroll-position der Seite, scrollt das element in der Ansicht (die es an der Spitze des scrollbaren div) und dann setzt die Seite die position zurück, wo es war. Vermutlich nicht die ideale Lösung, aber es wird den job zu erledigen.

    • Danke für die Antwort - ich werde mal einen Blick in diese. In der Zwischenzeit habe ich zu haben scheinen erreicht, was ich Bedarf, indem Sie einfach die Einstellung der div.scrollTop dem offsetTop von dem element verknüpft.
    InformationsquelleAutor Ender
  2. 0

    Konnten Sie Experimentieren mit der Zuweisung integer-Werte, um die scrollTop-Eigenschaft.

    InformationsquelleAutor Joachim VR
Schreibe einen Kommentar