Eine kurze Diskussion über die Bildlaufposition scrollTop und scrollLeft_jquery von jQuery-Seiten

Webseiten sind oft größer als das Browserfenster, in dem die Seite angezeigt wird, was dazu führt, dass die Seite oft höher und manchmal breiter als der Browser ist, was Besucher dazu zwingt, die gesamte Seite anzuzeigen Seite (dargestellt in Abbildung 10-8). Wenn Besucher scrollen, verschwinden Teile des Dokuments aus der Ansicht. Beispielsweise passt eine Webseite nicht vollständig in das Browserfenster und das Dokument scrollt nach links oder oben, sodass die obere und linke Seite der Seite nicht mehr angezeigt wird. Das bedeutet, dass die obere linke Ecke des Browserfensters und die obere linke Ecke des Dokuments nicht identisch sind. Wenn Sie versuchen, ein neues Element, beispielsweise ein dynamisches Banner, oben auf dem Bildschirm zu platzieren, geraten Sie in Schwierigkeiten, wenn Sie einfach versuchen, die linke und obere Position des Elements auf 0 zu setzen. Sie platzieren es eigentlich nur oben im Dokument, jedoch außerhalb des Browserfensters.

Glücklicherweise bietet jQuery zwei Funktionen, mit denen Sie bestimmen können, wie viel von der Seite von oben und links gescrollt wird (mit anderen Worten, wie viele Pixel des Dokuments oberhalb und links vom Browserfenster vorhanden sind). Um festzustellen, wie viel des Dokuments sich über dem Browserfenster befindet, verwenden Sie diese Codezeile:

Code kopieren Der Code lautet wie folgt:

$(document).scrollTop()

Um zu bestimmen, wie viel des Dokuments sich auf der linken Seite des Bildschirms befindet, verwenden Sie diese Codezeile:

Code kopieren Der Code lautet wie folgt:

$(document).scrollLeft()

Beide Funktionen geben einen Pixelwert zurück, den Sie verwenden können, um ein anderes Element auf der Seite zu positionieren. Wenn Sie beispielsweise ein Popup in der Mitte der Seite positionieren möchten, auch nachdem jemand nach unten gescrollt hat, müssen Sie ermitteln, wie weit der Besucher gescrollt hat, und das Popup so verschieben, dass sich viele der zusätzlichen Elemente am unteren Rand der Seite befinden. Im Beispiel eines angezeigten Tooltips müssen Sie beim Auffinden des Tooltips vorsichtig sein, wenn der Besucher auf einer Seite nach unten gescrollt hat: Es ist leicht, den Tooltip versehentlich im Seitenbereich, aber außerhalb der Sichtbarkeit des Browsers zu platzieren Bereich des Mundes. Verwenden Sie scrollTop(), um zu vermeiden, dass ein Tooltip über dem sichtbaren Bereich oben im Browserfenster platziert wird.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.