Parallax Website mit Hintergrundwechsel.

  • Halli Hallo,

    ich bin auf die Seite http://www.drykorn.com/de/magazine/ gestoßen und finde die Idee mit dem wechselnden Hintergrund spannend und würde das gerne Nachbauen.
    Kann mir jemand weiterhelfen und grob erläutern oder ob es sowas in der Art schon irgendwo als Plugin, Template gibt?
    Also ein Fullscreen background image, welches sich je nach Scrollweite ändert. Der 3d Effekt muss nicht sein.


    Danke,
    Gruß

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Prinzipiell ist es eigentlich ganz einfach. Du brauchst eine Slideshow, die du fix positionierst und per JavaScript auslöst. Dann brauchst du nur noch auf das Event window.onscroll reagieren. Im Grunde sollte es eigentlich mit ein paar Zeilen Javascript machbar sein etwas ähnliches umzusetzen.

    P.S.: Ich glaub dein Post wäre in der Kategorie "Design" besser aufgehoben.

  • Oh, hab deinen Post ganz übersehen.
    Vielen Dank schonmal!


    Bei mir hängt es nur an der Ansteuerung eines Sliders per Javascript. Hast du ein Tipp für ein Slider, welcher vielleicht schon ne Anbindung dazu hat?
    Javascript und ich werden glaub ich keine Freunde :)

  • Hallo Mixter

    Ich würde das mittels CSS3 lösen.
    Vorteil: kein Slider notwendig (dadurch weniger Code!) und funktioniert auch ohne JS.
    Nachteil: Ältere Browser können manche Angaben nicht interpretieren.

    Wie das geht findest du hier: http://webseasoning.com/design/create-…x-effects/1851/
    Zugegebenermassen ein sehr grosses Beispiel - wie du auch an der Demo sehen kannst: http://onlinefreetips.com/tutorials/scro…shed/index.html
    Wenn du dir aber nur den Background (in deinem Fall mit Bildern, anstelle von reiner Farbe) herausnimmst, bleibt der Aufwand gering.

    LG

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!