Anzeige

Farbverlauf in einer Parallaxe

Farbverlauf in einer Parallaxe | PSD-Tutorials.de

Erstellt von MickNiller125, 06.10.2015.

  1. MickNiller125

    MickNiller125 Noch nicht viel geschrieben

    Dabei seit:
    05.10.2015
    Beiträge:
    2
    Geschlecht:
    männlich
    Ort:
    München
    Software:
    Photoshop, InDesign, Illustrator, Dreamweaver, Premiere, After Effects
    Kameratyp:
    Casio Exilim FX-20, Rolleiflex SL36, Sony alpha 6000
    Farbverlauf in einer Parallaxe
    Hallo zusammen,

    ich habe mich hier eben angemeldet, weil ich seit ein paar stunden das web durchforste aber leider nicht fündig geworden, was mein gegenwärtiges Problem lösen könnte. Ich schlängle mich gerade wieder ein die Webdesign-Welt hinein. Und zwar würde ich gerne in meine Webseite eine Parallaxe einzubauen. Ich baue gerade das Grundgerüst und fange beim Hintergrund an doch es klappt nichts was ich versuche. ヽ(ಠ_ಠ)ノ

    Vorweg, stellt auch das ganze vor wie eine Folie, mit transparenten stellen, die über einen festen Hintergrund gezogen wird. Die Farben sind nur beispielhaft.
    Mein Konzept für den Hintergrund besteht aus zwei Farbebenen, die untere Ebene1(blau) ist fixed. Darüber Ebene2(rot) als Farbverlauf mit einer Transparenz. Ebene2 soll beim Scrollen seine Farbe ändern zu grün.

    Man stelle sich drei Bilder untereinander vor wie ihr durch scrollt.

    erstes Bild:
    Blauer Hintergrund
    Roter Verlauf zu transparent von unten nach oben

    zweites Bild
    Solider verlauf von Rot zu Grün

    drittes Bild
    Blauer Hintergrund
    Grüner Verlauf zu transparent von unten nach oben

    Natürlich könnte ich das mit einer png hinbauen aber ich denken nicht das es sich anpassen lässt je nach Content.
    Plus dazu kommen noch verschiedene Elemente dazu die sich im Scroll-Vorgang auseinander bauen und sich wieder zusammen setzen.


    Ich hoffe ich habe es so gut wie möglich erklären können. Falls nicht, bitte zerpflückt mich nicht.(⊙_⊙')

    Vielen dank schon mal im voraus :)

    Grüße

    MickNiller125
     
    #1      
  2. patrick_l

    patrick_l Stereotyp(e)

    22
    Dabei seit:
    11.05.2008
    Beiträge:
    7.629
    Geschlecht:
    männlich
    Ort:
    NRW
    Software:
    CS6/CC2017, Affinity, Atom, Brackets, PHPStorm, Pug, Sass, Wacom
    Kameratyp:
    Canon DSLR [...]
    Farbverlauf in einer Parallaxe
    Grüß dich Mick,

    was hast du denn bisher versucht? Im Internet findest du eigentlich genügend Schritt für Schritt Anleitungen zum Erstellen von Parallax Websites. Ebenso frei nutzbare Snippets und/oder Plugins (jQuery). Bezüglich Transparenzen wäre beispielsweise mit RGBA Farbwerten möglich.

    Liebe Grüße, Patrick
     
    #2      
  3. MickNiller125

    MickNiller125 Noch nicht viel geschrieben

    Dabei seit:
    05.10.2015
    Beiträge:
    2
    Geschlecht:
    männlich
    Ort:
    München
    Software:
    Photoshop, InDesign, Illustrator, Dreamweaver, Premiere, After Effects
    Kameratyp:
    Casio Exilim FX-20, Rolleiflex SL36, Sony alpha 6000
    Farbverlauf in einer Parallaxe
    Hallo Patrick,

    danke für deine schnelle Antwort. Da hast du recht, an Plugins hab ich noch gar nicht gedacht. Ich hab schon recht viel gesucht aber nie das gefunden wonach ich suche,vielleicht suche ich falsch. Zu RGBA habe ich mir bei Colorzilla was zusammengeschraubt. Allerdings bekomme ich es nicht wirklich zum laufen. Der Hintergrund steht auf alle fälle schon mal.

    Das traurige an der Sache ist, ich wusste schon mal wie das geht und habe es schon des öfteren gemacht... aber irgendwie wurde das während meiner Abschlussprüfung ziemlich weit hinten verstaut. Das wird vermutlich eine Tortur aber da muss ich durch.

    Grüße

    MickNiller
     
    #3      
x
×
×