So lösen Sie das Problem mit der Fehlausrichtung der niceScroll-Bildlaufleiste in jQuery

Im Folgenden werde ich Ihnen eine Lösung für das Problem der Fehlausrichtung der jQuery-niceScroll-Bildlaufleiste vorstellen. Sie hat einen guten Referenzwert und ich hoffe, dass sie für alle hilfreich ist.

Obwohl das NiceScroll-Plug-In sehr nützlich ist, ist es schließlich nicht auf CSS angewiesen, und Sie können mit nur JS gut aussehende Bildlaufleisten einrichten.

Ich habe kürzlich niceScroll in meinem Projekt verwendet und es gibt eine horizontale Bildlaufleiste in der Tabelle. Es ist leicht, die vertikale Bildlaufleiste zu verlegen, das heißt, die Bildlaufleiste hängt in der Luft, nicht unten oder rechts von p. Öffnen Sie f12. Es ist ersichtlich, dass die Bildlaufleiste nicht direkt innerhalb von p positioniert ist, sondern am Ende des gesamten Körpers, auf derselben Ebene wie das zu positionierende p, was zu diesem Fehler führt , insbesondere im IE, wo die Bildlaufleiste herumfliegt︿( ￣︶￣)︿.

Nachdem ich viele Informationen im Internet durchsucht habe, scheint es, dass diese Situation nicht existiert. Möglicherweise verfügt ihr Projekt nicht über so viele horizontale Bildlaufleisten. . . . .

Um diesen Fehler zu beheben, dachte ich damals daran, die Bildlaufleiste in p zu setzen, damit sie nicht schwebt. Nach vielen Tests habe ich später herausgefunden, dass die Positionierung von position:absolute auf dem p so eingestellt werden muss, dass die Bildlaufleiste darin verschachtelt wird und es zu keinem zufälligen Schweben und Fehlausrichten kommt.

Wenn keine Positionierung erfolgt, befindet sich die Bildlaufleiste am Ende des Körpers, wie im Bild gezeigt:

Die Bildlaufleiste nach der Positionierung befindet sich in p, wie im Bild gezeigt:

Ich verwende die Rasterform von wex5, füge in der Rasterzeile den Klassennamen GridPositon hinzu und setze ihn auf absolute Positionierung Stellen Sie es dann auf die relative Positionierung in seinem übergeordneten Element ein: „Das untergeordnete Element muss mit dem übergeordneten Element identisch sein.“ Nach diesem Vorgang wurde das Problem der Aussetzung und Fehlausrichtung der Bildlaufleiste behoben, aber im IE tritt ein neuer Fehler auf, d IE) und wenden Sie dann zwei weitere Schichten von p an, wodurch das Problem der fehlenden Farbe unter IE gelöst wird. Die endgültige Struktur ist also wie folgt:

Zusammenfassung: Solange das verwendete p absolut positioniert ist, ist die Bildlaufleiste wird in in verschachtelt. Der Grund dafür, dass es im IE keine Farbe gibt, liegt darin, dass es relativ direkt auf seinem übergeordneten Fenster positioniert ist. Daher habe ich es später in eine relative Positionierung im äußersten Fenster geändert, sodass ich mir nicht so viel Mühe geben muss, seine Struktur zu ändern . Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

So implementieren Sie die automatische Recyclingverbindung für MySQL-Transaktionen in Node.js

So erreichen Sie die maximale Gemeinsamkeit in JavaScript-Teilzeichenfolgen

Verwenden Sie Nginx in vue.js, um domänenübergreifende Probleme zu lösen

Das obige ist der detaillierte Inhalt vonSo lösen Sie das Problem mit der Fehlausrichtung der niceScroll-Bildlaufleiste in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!