| Autor |
Nachricht |
Briziel
Threadersteller
Dabei seit: 09.02.2010
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 09.02.2010 12:42
Titel Div Position abhängig von Scrollposition |
  |
|
hi leute!
für meine bewerbung an einer kunsthochschule für das fach digitale medien möchte ich einen web auftritt gestalten. Dabei soll ein teil der seite ein div sein, der sich proportional zur scrollposition verschiebt.
Mein bisheriger kenntnisstand ist, dass das div fixed sein muss und ich irgendwie die Scrollbarposition per Javascript auslesen und einen wert in Prozent an die postion des div weitergeben muss...
irgendwelche vorschläge tipps?
| Zitat: | Scrollbar ganz oben:
----- //seite
---- //div
####
####
####
---- //endediv
-
-
-
-
-
-
----- // endeseite |
| Zitat: | Scrollbar mitte:
----- //seite
-
-
-
---- //div
####
####
####
---- //endediv
-
-
-
----- // endeseite |
| Zitat: | Scrollbar ganz unten:
----- //seite
-
-
-
-
-
-
---- //div
####
####
####
---- //endediv
----- // endeseite |
|
|
| |
  |
 |
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: 
|
Verfasst Di 09.02.2010 13:02
Titel
|
|
|
Das Element soll sich beim scrollen entgegen der normalen Richtung bewegen?
Zuletzt bearbeitet von m am Di 09.02.2010 13:03, insgesamt 1-mal bearbeitet
|
|
| |
 |
|
|
Anzeige
|
|
|
SimonDerDude
Dabei seit: 15.01.2010
Ort: error: undefined
Alter: 35
Geschlecht:
|
Verfasst Di 09.02.2010 18:04
Titel
|
|
|
So?
EDIT:
Installier dir am besten einmal den Firebug im Firefox.
Extras > Add-ons > Firebug suchen > Firebug installieren > Firebug ist unten rechts zu sehen und einfach zu verstehen
Zuletzt bearbeitet von SimonDerDude am Di 09.02.2010 18:08, insgesamt 2-mal bearbeitet
|
|
| |
|
|
Briziel
Threadersteller
Dabei seit: 09.02.2010
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 10.02.2010 01:23
Titel
|
|
|
| Azazael hat geschrieben: | So?
EDIT:
Installier dir am besten einmal den Firebug im Firefox.
Extras > Add-ons > Firebug suchen > Firebug installieren > Firebug ist unten rechts zu sehen und einfach zu verstehen |
nein nicht so... das ist ja einfach n fixed div... ich will aber einen div der sich proportional zur scrollbar position auf 100% main bewegt
|
|
| |
|
|
SimonDerDude
Dabei seit: 15.01.2010
Ort: error: undefined
Alter: 35
Geschlecht:
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 10.02.2010 10:58
Titel
|
|
|
| m hat geschrieben: | | Das Element soll sich beim scrollen entgegen der normalen Richtung bewegen? |
|
|
| |
|
|
easteregg
Dabei seit: 15.02.2003
Ort: Deutschland
Alter: 36
Geschlecht:
|
Verfasst Do 11.02.2010 22:34
Titel
|
|
|
| m hat geschrieben: | | m hat geschrieben: | | Das Element soll sich beim scrollen entgegen der normalen Richtung bewegen? |
|
Gilt hier die Theorie, dass Zitieren die Wahrscheinlichkeit einer Antwort erhöht? 
Ich kenne leider selber auch nicht die Lösung, geschweige denn konnte ein Beispiel finden. Ich werde aber versuchen es so zu erklären, dass diejenigen, die dir helfen könnten, es verstehen:
Eine Seite hat eine Scrollleiste. Angenommen ihr seid ganz oben auf der Seite. Dann ist in der rechten oberen Ecke ein Div. Scrollt ihr nun runter, scrollt das Div mit - aber nicht nur das, es bewegt sich auf der selben Höhe, wie die Scrollleiste. Es stellt also nicht ein position: fixed; div dar, denn die bleiben eben an einer fixen Position beim Scrollen.
Wurde nun nach ganz unten gescrollt, befindet sich das besagte Div in der unteren rechten Ecke.
Und hier noch eine Idee, wie man es lösen könnte:
- Auslesen der Seitenhöhe in Pixel
- Auslesen der aktuellen Scrollposition (z.B. window.pageYOffset) in Pixel
- Scrollposition (ggf. minus Browserfenster-Höhe) / Seitenhöhe = Var X
- Scrollposition + ((Browserfenster-Höhe * Var X) - Höhe des Div) = Y-Koordinate des Divs (z.B. Position: absolute; top: ... px;)
Müsste in der Art klappen. Aber natürlich ohne Gewähr 
Zuletzt bearbeitet von easteregg am Do 11.02.2010 22:36, insgesamt 1-mal bearbeitet
|
|
| |
|
|
Briziel
Threadersteller
Dabei seit: 09.02.2010
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Do 11.02.2010 22:34
Titel
|
|
|
| m hat geschrieben: | | Das Element soll sich beim scrollen entgegen der normalen Richtung bewegen? |
ganz genau... allerdings soll sich der hintergrund regulär bewegen
| easteregg hat geschrieben: | Ich kenne leider selber auch nicht die Lösung, geschweige denn konnte ein Beispiel finden. Ich werde aber versuchen es so zu erklären, dass diejenigen, die dir helfen könnten, es verstehen:
Eine Seite hat eine Scrollleiste. Angenommen ihr seid ganz oben auf der Seite. Dann ist in der rechten oberen Ecke ein Div. Scrollt ihr nun runter, scrollt das Div mit - aber nicht nur das, es bewegt sich auf der selben Höhe, wie die Scrollleiste. Es stellt also nicht ein position: fixed; div dar, denn die bleiben eben an einer fixen Position beim Scrollen.
Wurde nun nach ganz unten gescrollt, befindet sich das besagte Div in der unteren rechten Ecke. |
genau so solls seins.. bzw so, dass man einstellen kann wieviel prozent der höhe oder breite des browserfenster der div erreicht haben soll wenn der scrollbar ganz runter / zur seite gezogen ist.
| easteregg hat geschrieben: | Und hier noch eine Idee, wie man es lösen könnte:
- Auslesen der Seitenhöhe in Pixel
- Auslesen der aktuellen Scrollposition (z.B. window.pageYOffset) in Pixel
- Scrollposition (ggf. minus Browserfenster-Höhe) / Seitenhöhe = Var X
- Scrollposition + ((Browserfenster-Höhe * Var X) - Höhe des Div) = Y-Koordinate des Divs (z.B. Position: absolute; top: ... px;)
Müsste in der Art klappen. Aber natürlich ohne Gewähr |
vielen dank. aber müsste man das dann mit jquery oder so lösen? oder wäre eine reine javascript lösung auch möglich?
Zuletzt bearbeitet von Briziel am Do 11.02.2010 22:44, insgesamt 2-mal bearbeitet
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Zoom abhängig von Position des Mauszeigers
Javascript: Scrollposition auslesen
CSS vom Server abhängig?
FlashMX - setInterval abhängig von mausposition
Formular weiterleitung abhängig von Eingabe
dyn. Hintergrund: Echtzeitwechsel abhängig von Tageszeit?
|
|
Willkommen auf dem Portal für Mediengestalter
