Wie macht man sowas?

martin65

Boskoop
Registriert
03.12.11
Beiträge
40
Hallo liebes Forum,

ich möchte mich dem Thema Website selber erstellen nähern… ich möchte etwas ähnliches machen wie das hier : http://www.william-cohn.com … wie macht man sowas? Die Site ist mit webacapella erstellt. Kann mir jemand einen Tipp geben, wie ich das vorgehen muss?

Vielen Dank und Grüße
Martin
 

Bananenbieger

Golden Noble
Registriert
14.08.05
Beiträge
25.515
"das hier" nennt sich übrigens Parallax Scrolling. Kann man, wie schon von Scotch gesagt, prima mit jQuery realisieren.
 

martin65

Boskoop
Registriert
03.12.11
Beiträge
40
jquery, parallax scrolling, bootstrap-template, theme,… jede Menge Antworten… vielen Dank dafür. Ich glaube ich habe erstmal genug Hausaufgaben… :)
 

zilVerGFX

Macoun
Registriert
26.12.08
Beiträge
118
Moin,

ich bin grad zufällig auf diesen Thread gestoßen und wollte meine Vorredner einmal kurz korrigieren :)
Das hier ist kein Parallax-Scrolling und kann fast ausschließlich mit CSS realisiert werden. Das Einzige was hier Javascript ist, ist die Navi welche oben hängen bleibt und nicht weiter mit hochscrollt, und eben das automatische Scrollen.

Parallax-Scrolling ist was völlig anderes und sehr viel aufwändiger als diese Seite hier. Für den Hintergrund-"Effekt" schau mal hier:
http://www.w3schools.com/cssref/pr_background-attachment.asp

...und für das automatische scrollen (jQuery):
Code:
$( 'html, body' ).animate({

    // #container wäre in dem fall die ID des Containers zu dem gescrollt werden soll
    scrollTop: $( '#container' ).offset().top

}, 'slow');
Viel Spaß :)
 
  • Like
Reaktionen: mkr* und Nathea

Bananenbieger

Golden Noble
Registriert
14.08.05
Beiträge
25.515
Stimmt. Da hatte ich mich verguckt. Nichtsdestotrotz ist bereits simples Parallax-Scrolling schöner als ein Sticky Background.