Ergebnis 1 bis 4 von 4

Thema: Unterstützung mit Design (Hintergrundbild) - soll speziell scrollen

  1. #1
    Junior Avatar von fralix
    Registriert
    Jul 2016
    Beiträge
    62
    Gefällt mir!
    107
    Du gefällst: 8

    Unterstützung mit Design (Hintergrundbild) - soll speziell scrollen

    Edit:

    Problem behoben, Parallax Scrolling hieß das Zauberwort.

    ---


    Hallo,

    ich arbeite gerade an einer Homepage für unsere schuleigene Schülerzeitung.

    Leider habe ich von Webdesign wenig Ahnung, ich arbeite sehr gerne im Frontend. Gester saß ich 5 Stunden (!) an der Navigation (SpongeBob möge es bestätigen ) und bevor ich jetzt eine Woche an meinem Problem sitze, dachte ich, ich frage hier mal schnell nach - vermutlich braucht ein erfahrener Webentwickler da ein paar Minuten zu.


    Worum geht es: Die Seite verwendet ein Hintergrundbild welches in der Regel senkrecht ist, da wir immer das aktuelle Titelbild der Ausgabe nehmen, welche in A4 gedruckt wird.
    Jetzt soll dieses aber beim Runterscrollen sich mit bewegen, und zwar so, dass wenn man ganz oben auf der Seite ist, man auch ganz oben beim Bild ist.
    (So, als ob das Bild einfach von oben nach unten eingebunden wird).

    Wenn man jetzt aber nach unten scrollt, soll sich das Bild mit der Geschwindigkeit mitbewegen, sodass man, wenn man unten auf der Seite ist, auch unten das Bild sieht.
    Wenn man also eine Seite mit viel Inhalt hat, dann scrollt das Bild ganz langsam runter, damit das Bild auch für die gesamte Seite "reicht". Es darf also keinerlei repeat oder so geben.

    Ich hoffe, dass war verständlich genug, hier die Seite, mit der ich mich so abmühe (Keine Sorge, wir wollen uns noch eine TLD besorgen, das ist nur ein Testserver): (Entfernt)
    Geändert von fralix (03.10.2016 um 19:23 Uhr)

  2. Werbung - Hier werben?
  3. #2
    Junior Avatar von Silbereisen
    Registriert
    Mar 2015
    Beiträge
    94
    Gefällt mir!
    56
    Du gefällst: 197
    Hey du,

    habs leider nur kurz überflogen. Wenn ich es richtig verstehe, sollte das:

    Code:
    background: #D7484E url('/media/file/bg.png') top no-repeat;
    background-attachment: scroll;
    background-size: cover;
    dein Problem lösen
    As you've noticed, this land is flush with the mad and wicked

  4. #3
    x21
    Gast
    Parallax.js | Simple Parallax Scrolling Effect with jQuery

    Ist glaube ich das was du suchst.

    Um dir die Arbeit zu erleichtern, hast du schon versucht auf Frameworks wie Materialize oder Bootstrap auszuweichen ?
    Geändert von x21 (02.10.2016 um 16:33 Uhr)

  5. Diesen Mitgliedern gefällt dieser Beitrag:


  6. #4
    Junior
    THEMENSTARTER

    Avatar von fralix
    Registriert
    Jul 2016
    Beiträge
    62
    Gefällt mir!
    107
    Du gefällst: 8
    @Silbereisen: Sieht gut aus, leider ist es nicht ganz das, was ich brauche. Es sieht so aus, als ob es lediglich anpasst, ich brauche aber etwas, was "dynamisch" scrollt.

    @x21: Ich teste das gleich aus.
    Warum kein Bootstrap / fertiges Design: Ich nutze so etwas für sehr viele Projekte. Leider ist von der Schülerzeitung das Design mehr oder weniger vorgeschrieben, wir haben für unsere Zeitung bei jeder Ausgabe ein Facebook Design gewählt, welches sich auch auf der Homepage (eigentlich 1:1 ) wiederspiegeln sollte.

    - - - - - - - - - - Beitrag nachträglich erweitert - - - - - - - - - -

    das Parallax Scrolling ist eigl. genau das, was ich gesucht habe.

    Nur noch ein kleines Problem:
    Wie schaffe ich es, die data-speed dynamisch an die Länge meiner Seite anzupassen? Es ist zwar nicht schlimm, dass global zu setzen, es wäre aber cooler, wenn das auf jeder Seite individuell bestimmt wird.
    Geändert von fralix (03.10.2016 um 19:25 Uhr)

Ähnliche Themen

  1. (Biete) - Unterstützung als Trader
    Von bambam im Forum Trader / Uploader (FTP/FXP/...)
    Antworten: 1
    Letzter Beitrag: 18.11.2023, 20:51
  2. Antworten: 19
    Letzter Beitrag: 16.12.2016, 13:04
  3. Das ging schnell: Drohne speziell für Pokémon Go
    Von RedDevil im Forum Allgemeine News
    Antworten: 10
    Letzter Beitrag: 21.07.2016, 00:06
  4. (Suche) - Unterstützung für SEO (langfristig)
    Von JamJam im Forum Autoren / Texter, SEO
    Antworten: 2
    Letzter Beitrag: 14.07.2016, 10:40
  5. (Suche) - FXP Crew sucht hackende Unterstützung
    Von dizzl im Forum Penetrationtester
    Antworten: 16
    Letzter Beitrag: 10.11.2015, 03:45

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •  
SzeneBox.org... im Mittelpunkt der Szene!
© since 2015 szeneBOX.org - All Rights Reserved
Domains: www.szenebox.org