it-swarm.com.de

Wie kann ich einen Link zu einer bestimmten Position auf einer Webseite erstellen?

Ist es möglich, einen Hyperlink zu einer bestimmten Bildlaufposition auf einer Webseite zu erstellen? Zum Beispiel möchte ich einen Link zu http://www.stackoverflow.com/ erstellen, wobei die Seite jedoch 100 Pixel nach unten gescrollt ist.

14
Anderson Green

Sie können mit dem jQuery scrollTo-Plugin zu einer bestimmten Position scrollen. Wenn Sie sich die Demo-Seite ansehen, werden Sie feststellen, dass das Plugin viele verschiedene Optionen bietet, einschließlich des Bildlaufs zu einer bestimmten Position. Das bedeutet jedoch, dass Sie das JavaScript des Ziels steuern müssen, sodass dies möglicherweise nicht für einen Link zu einer externen Website geeignet ist.

3

Der Vanilla Way-Link zu einer bestimmten Stelle auf der Seite befindet sich über einen Ankerpunkt , der bereits auf der Seite vorhanden ist.

Dies kann mit dem Tag <a>…</a> erstellt werden. Beachten Sie, dass der unter "Ankerpunkt" (oben) angegebene Link am Ende #h-12.2 enthält. Dies entspricht <a id="h-12.2">12.2</a>, der in den HTML-Code der Seite eingebettet ist. Wenn Sie darauf klicken, wird die Seitenansicht an diesem Anker neu positioniert.

Beachten Sie, dass vor HTML5 das Attribut name im Ankertag verwendet wurde, aber nicht mehr unterstützt wird und das Attribut id an seiner Stelle verwendet werden sollte ( Referenz ). Dies bedeutet auch, dass Sie jedes Element für ein Ankertag verwenden können. Sie sind nicht auf das Element <a> beschränkt.

15
Paul

Ähnlich wie bei Pauls Antwort können Sie auch auf das erste Vorkommen einer Tag-ID in einem HTML-Dokument verweisen. Dies ist jedoch keine exakte Anzahl von Pixeln.

Verknüpfe/scrolle zum Beispiel mit den Fragen oder Antworten dieser Seite.

6

Klicken Sie mit der rechten Maustaste und überprüfen Sie die Elemente auf der Seite. Sie finden die <a> Tags, das sind die Ankerpunkte.

Entfernen Sie dann den < vor dem ersten und letzten a, damit diese nicht als Links angezeigt werden. Sie können die Auswirkungen tatsächlich sehen, während Sie in das Antwortfeld schreiben, wenn die Vorschau unten angezeigt wird.

a href="https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header">question /a>

und

a href="https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers">answers /a>

Wie Sie sehen, befindet sich der einzige Unterschied ganz am Ende, wo die Ankernamen nach dem Pfundsymbol (#) stehen. Der Name nach dem > gibt an, wie der Link für den Benutzer gelesen wird.

In diesem Fall lautet "Fragenkopf" "Frage" und die Antworten sind zufällig gleich.

Dann sollte der folgende Link zu Mikes Kommentar führen. Da ihr Ankerpunkt 382094 ist

Zur Verdeutlichung können Sie einfach den Anker finden und den # nach Ihrem Link einfügen.

https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#question-header

https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#answers

https://superuser.com/questions/382047/linking-to-a-specific-scroll-position-on-a-web-page#880079

diese führen Sie alle zu verschiedenen Orten auf derselben Seite.

6
Georgeq

Um eine Verknüpfung zu einer pixelspezifischen Position auf einer Seite herzustellen, platzieren Sie das Ankertag in einem Div, das absolut mit den Koordinaten "top: x left: y" positioniert ist.

1
Graeme

Sie können Citebite verwenden, um eine Verknüpfung zu einer bestimmten Position einer Webseite herzustellen, auch wenn an dieser Position keine ID verwendet wird. Es ist einfach zu bedienen. Gehen Sie einfach zu dem Link, den ich hier bereitgestellt habe, und fügen Sie den Teil des Texts, den Sie anzeigen möchten, zuerst ein, nachdem Sie zu Ihrer Webseite in das Textfeld Zitat gegangen sind, und geben Sie dann den Link der Webseite in das Textfeld Quell-URL ein. Klicken Sie dann auf Citebite erstellen. Dann wird ein Link erzeugt. Dieser Link wird Ihr gewünschter Link sein.

0
Farabi Siddique