scrollbar-hält auf-scrollen in jstree

Habe ich eine Reihe von Daten angezeigt wird, wie ein Baum mit Hilfe von jstree-plugin und jquery.

Den Daten zeigt sich perfekt in der Baumstruktur. Auf den ausbau des letzten Knoten im Baum die Bildlaufleiste erscheint auf der rechten Seite der div-block.

Problem:
Jedoch wenn ich navigieren Sie innerhalb der Baumstruktur mit der Maus über die Bildlaufleiste die Bildlaufleiste, hält scrollen nach unten und nicht nach oben gehen.

Ich bin mit Latein am Ende, was könnte der Grund sein. Ich benutze einen Mozilla Firefox-browser.

Bitte helfen.

Beispielcode unten:

css:

.myScrollableBlock {
  display: block;
  height: 170px;
  overflow: auto;
}

.jsp:

<div id="myTreeDiv" class="myScrollableBlock">
</div>

.js:

$('div#myTreeDiv').jstree({
//jsTree plugins
    ...
    ...
    ...
});
  • Nicht sicher, was du meinst mit "navigieren Sie innerhalb der Baumstruktur mit der Maus über die Bildlaufleiste". Wie sind Sie auf die Navigation genau? Verwenden Sie die Bildlaufleiste? Ich Frage mich, ob es ein bug ist, der hält das auslösen einer scroll-Ereignis...
  • Ja Lodert. Ich bin mit der Bildlaufleiste, um einen Bildlauf nach oben und unten. Das problem ist: es hat einfach stetig hält auf dem Weg nach unten nach der Erweiterung den Knoten. Ich wollte ziehen Sie ihn nach oben, um zu sehen, die Knoten auf der Oberseite durch klicken und halten der Bildlaufleiste. Aber jedes mal, wenn ich versuche zu verschieben, bis es immer weiter stetig nach unten scrollen, bis er das Ende des Blocks Höhe.
  • Erste, würde ich vorschlagen, die überprüfung Ihrer version von jstree um sicherzustellen, dass es die Letzte ist. Dann würde ich vorschlagen, die nicht minimierte version der jstree-und debugging-das scroll-Ereignis - es könnte Ihnen einige Einblicke.
InformationsquelleAutor dirai | 2014-09-12
  1. 15
    • Wie Lösen

    Den Sie gerade haben, um einen anderen div, bevor das div, wo Sie instanziieren die jstree, und fügen Sie die Klasse="myScrollableBlock" an den äußeren div. Wie diese:

    <div class="myScrollableBlock">
    <div id="myTreeDiv"></div>
</div>
    • Erklärung

    Wenn Sie dinamically erstellen der jstree, den Aufruf der jquery-Funktion

    $('div#myTreeDiv').jstree({...});

    Überlappt jede der statischen css-style angegeben werden, bevor (class="myScrollableBlock" in Ihrem Fall).

    Können Sie einen quick-check so:

    <div style="padding: 20px 20px; overflow: auto; height:170px;">
    <div id="myTreeDiv"></div>
</div>

    Warum CSS überlappt wird per JS?

    Beim laden einer HTML-Datei, der browser führt das JS Script auf, nachdem die DOM-und CSS-Dateien aufgebaut sind. Überlappende alles, was getan wurde, vor.
    scrollbar-hält auf-scrollen in jstree
    Bild-Quelle: https://www.sitepoint.com/optimizing-critical-rendering-path/

    InformationsquelleAutor tremendows
Schreibe einen Kommentar