Hintergrundbilder auf die gesamte Bildschirmbreite responsive machen?

Nina-D escrito el 01.02.PM a las 13:01 horas

Hallo liebe Community,

es ist ja doch seit längerem recht schick, einzelne Passagen einer Website, wie den Header oder auch andere, mit einem Bild zu hinterlegen, das den gesamten Bildschirm füllt.

Hat hier jemand einen Tipp wie ich das machen kann?

Z.B. so wie bei der aktuellen WD-Verkaufseite von Magix:

https://www.magix.com/de/sem/web-designer/neuheiten/#c1587827

Ich meine nur das Hintergrundbild, zb ganz oben, auf die ganze Breite, nicht diesen "Scrolleffekt".
Wobei mir der Scroll-Effekt auch ein Rätsel ist, wie man den verwirklichen könnte.😅

Wenn ich mein Hintergrund einfach nur größer mache, sodass keine Seitenränder rechts und links mehr da sind, ist es nicht wirklich responsive. Wenn ich nämlich bei Magix die Seite verkleinere, entsteht nie ein Rand beim Hintergrundbild.

Ich hoffe, ihr versteht was ich meine und könnt mir da einen Tipp geben?

Comentarios

BilderMacher escrito el 01.02.PM a las 14:50 horas
es ist ja doch seit längerem recht schick, einzelne Passagen einer Website, wie den Header oder auch andere, mit einem Bild zu hinterlegen, das den gesamten Bildschirm füllt.

Hat hier jemand einen Tipp wie ich das machen kann?

Über das Kontextmenü kann man einstellen, ob fixiert und/oder ausgedehnt ...

Z.B. so wie bei der aktuellen WD-Verkaufseite von Magix:

https://www.magix.com/de/sem/web-designer/neuheiten/#c1587827

Ich meine nur das Hintergrundbild, zb ganz oben, auf die ganze Breite, nicht diesen "Scrolleffekt".
Wobei mir der Scroll-Effekt auch ein Rätsel ist, wie man den verwirklichen könnte.😅

Zum Scrolleffekt ...

https://www.magix.info/de/forum/scroll-animation-paralax--1236672/#ca1508934

 

"Je mehr die Menschen wissen, desto weniger müssen sie glauben!"

+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
Ich kann vieles, darf aber nicht alles.
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

-------------

Hardware / Software:
::::::::::::::::::::::::::::::::::::++++:::::::::::::::::::::::::::::::::::::::::::::::::

Intel(R) UHD Graphics (für Import, Verarbeitung, Export)

NVIDIA GeForce MX250 (wird nicht in Schnitt-SW verwendet)

  • Video deluxe 2016 Premium
  • Video deluxe 2025 Premium
  • Video Pro X 16
  • Photostory Deluxe 2025
  • Samplitude X7 Suite
  • ACID Pro 11
  • Music Maker 2025 Premium
  • MAGIX/XARA Graphic-/Web-Designer

-----------------------------------------------------------------------------------

Edition    Windows 10 Home
Version    2009
Installiert am    ‎15.‎10.‎2020
Betriebssystembuild    19045.5917

------------------------------------------------------------------------------------

Standardbrowser: Firefox 138.0.4

👶-Boomer

Nina-D escrito el 01.02.PM a las 15:14 horas

Hallo Bildermacher,

oh, vielen lieben Dank 🌼😀 Du hast mein Rätsel gelöst. Ich hätte ja nicht gedacht, dass es so einfach sein könnte, das Bild als "ausgedehnt" einzustellen.😅👍

Nun hat dieser Scrolleffekt auch einen Namen bekommen. Also Paralax-Effekt. Darüber werde ich mich dann auch mal schlau machen.

Dann bekommt meine Seite ein schickeres Update demnächst!