Position relativ zum Fenster

8

Ich habe ein Tumblr-Konto und arbeite daran, das HTML zu bearbeiten. Meine Frage ist folgende: Wie stelle ich meine Seitenleiste in einer bestimmten Position, aber dann scrolle ich auf der Seite nach unten, es bleibt dort, wo es relativ zu meinem Browser ist? Für ein Beispiel von dem, worüber ich rede, klicke auf "Frage stellen" und schaue auf "Ähnliche Fragen" und scrolle dann. Ich würde es vorziehen, dass es in CSS ist. Ich habe schon alles versucht, was mir einfällt.

    
judh1234 11.07.2013, 22:04
quelle

3 Antworten

21

setze die Elemente css position attribute auf fixed und user top / left und margin , um es dort zu platzieren, wo du es haben willst. Wie so:

%Vor%

Der obige Code würde ein 200px high div vertikal zentrieren und es 10px vom linken Rand platzieren.

AKTUALISIEREN

Dieses Beispiel zeigt Ihnen, wie Sie erreichen, wonach Sie suchen! Demo mit jquery

Aktualisieren (1)

Der folgende jquery-Code ist wahrscheinlich der schnellste Weg, um das zu erreichen, was Sie wollen, mit minimalen Änderungen an anderem html / css. Einfach den folgenden Code in eine Dokument bereit halten Funktion und ändern Sie die wenigen Bits von CSS wie unten angegeben.

%Vor%

Sie müssen das CSS für a3text ändern, um margin-top:60px zu erstellen, die Attribute position und margin-left entfernen und dann display: block

hinzufügen

Idealerweise hätten Sie icon , anchor3 und oldurl in einem Container div , so dass Sie jquery nur für den Container und nicht für die drei Elemente einzeln verwenden könnten!

Aber das sollte dich bekommen, was du willst (getestet auf der Live-Tumblr-Seite mit FF Scratchpad).

UPDATE (2)

Starten Sie Firefox und gehen Sie zu der Seite: Ссылка , öffnen Sie dann den Notizblock (UMSCHALT + F4) Kopieren Sie den folgenden Code und fügen Sie ihn ein und drücken Sie STRG + L. Es sollte dann etwas (im Notizblock) wie /* [object Object] */ sagen. Wenn das passiert, scrolle die Webseite herunter und sieh zu, wie die Magie passiert - wenn es das ist, was du willst, werde ich erklären, es für dich zu implementieren:)

%Vor%     
Steven 11.07.2013, 22:13
quelle
3

Sie können

verwenden %Vor%

Hier ist ein Spiel für die gleiche Ссылка , selbst wenn Sie den Körper scrollen, sollte das rote div dort positioniert werden.

>     
sublime 11.07.2013 22:10
quelle
2

Ich stimme zu, Position: behoben mit top: 0px und links: 0px sollte es tun. Achten Sie jedoch bei der Navigation auf feste Positionierung. Wenn der Bildschirm des Benutzers kleiner als das Menü ist, können Sie den Überlauf nie sehen.

    
TorranceScott 11.07.2013 22:17
quelle

Tags und Links