Ergebnis 1 bis 8 von 8

Thema: Skalieren Background Image

  1. #1
    Contao-Nutzer
    Registriert seit
    20.10.2009.
    Beiträge
    5

    Standard Skalieren Background Image

    Hallo Zusammen

    in meinem Template habe ich ein Backgroundimage mittels CSS im Body eingefügt:
    Code:
    body { background:url("pfad zum File")  center top repeat-y
    Funktioniert genau so wie ich es haben möchte:
    Korrekte Ansicht:
    jazz_fenster_korrekt.jpg


    Wenn man nun das Fenster verkleinert und nach rechts scrollt ergibt sich folgendes Problem:
    Fehlerhafte Ansicht:
    jazz_fenster_fehlerhaft.jpg

    Insbesondere auf dem Ipad ist dies nicht gewünscht.

    Kann man das Backgroundimage so setzen, dass es nicht skaliert? Sprich immer gleichgross bleibt, resp. abgeschnitten wird?
    Wie würde man dies machen?

    Besten Dank für Eure Hilfe.

    Grüsse

    Sacha
    Geändert von sachage (25.04.2014 um 06:17 Uhr)

  2. #2
    Contao-Nutzer
    Registriert seit
    06.01.2014.
    Beiträge
    40

    Standard

    Hallo,

    vielleicht suchst Du soetwas wie den easy_bg_stretcher?

    https://contao.org/de/extension-list...020009.de.html


    Gruß

  3. #3
    Contao-Nutzer
    Registriert seit
    20.10.2009.
    Beiträge
    5

    Standard

    Hallo Hermes2.11

    danke für Deine Antwort.

    Wenn ich es richtig verstehe kann der easy_bg_stretcher 'stretchen'. Ich such eine Möglichkeit dass der Background nicht skaliert wird.

    Gruss

    Sacha

  4. #4
    Contao-Urgestein Avatar von Samson1964
    Registriert seit
    05.11.2012.
    Ort
    Berlin
    Beiträge
    2.799

    Standard

    Ich denke mal, er muß sogar skaliert werden, damit es klappt. In der Grundeinstellung werden Hintergrundbilder nicht skaliert. Dein Hintergrund ist 1100px breit und bleibt auch so breit, wenn das Fenster schmaler wird. Dadurch entsteht wahrscheinlich diese seltsame Verschiebung. Aber vielleicht ist das ja schon eine Art Skalierung: Der Browser versucht links und rechts in body den weißen Rand beizubehalten. Und #wrapper behält seine Maße bei. Dein Hintergrundbild gehört aber nicht zu #wrapper. Zwangsläufig läuft dann was aus dem Ruder.

    Also das Bild in #wrapper reinpacken.
    Viele Grüße
    Frank

    Seit Mai 2013 Fan von Contao
    Webmaster vom Deutschen Schachbund und Berliner Schachverband
    Mein Blog: Schachbulle
    Meine Erweiterungen bei GitHub
    Meine Videos auf YouTube: Playlist zur Contao-Programmierung/Einrichtung

  5. #5
    Wandelndes Contao-Lexikon Avatar von tab
    Registriert seit
    22.10.2013.
    Beiträge
    10.095
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Was ist überhaupt was? Also was ist das Hintergrundbild von body und was sind Inhalte? Ist das Hintergrundbild nur ein dunkler Bereich mit hellem Rand?? Oder gehört der Rand auch schon nicht mehr zum Bild? Eins scheint mir offensichtlich: repeat-y ist zumindest optisch im "Fehlerfall" völlig danebengegangen.

  6. #6
    Contao-Urgestein Avatar von Samson1964
    Registriert seit
    05.11.2012.
    Ort
    Berlin
    Beiträge
    2.799

    Standard

    Code:
    #wrapper {
      background:url(background_festival.png) center top repeat-y
    }
    statt

    Code:
    body {
      background:url(background_festival.png) center top repeat-y
    }
    Viele Grüße
    Frank

    Seit Mai 2013 Fan von Contao
    Webmaster vom Deutschen Schachbund und Berliner Schachverband
    Mein Blog: Schachbulle
    Meine Erweiterungen bei GitHub
    Meine Videos auf YouTube: Playlist zur Contao-Programmierung/Einrichtung

  7. #7
    Contao-Nutzer
    Registriert seit
    20.10.2009.
    Beiträge
    5

    Standard

    Hallo Frank

    besten Dank für Deine Lösung. Nun funktioniert es wie gewünscht. Ich hab zwar noch nicht vollständig verstanden warum das so ist aber ich werde mich schlau machen.

    Du schreibts
    Und #wrapper behält seine Maße bei.
    Mich würde interessieren warum das so ist.

    Nochmals besten Dank und vielleicht am Jazzfestival in Sargans im schönen Heidiland? ;-)

    Grüsse

    Sacha

  8. #8
    Contao-Urgestein Avatar von Samson1964
    Registriert seit
    05.11.2012.
    Ort
    Berlin
    Beiträge
    2.799

    Standard

    Das DIV mit der ID wrapper ist der Container für Deine Website. Was liegt also näher als den Hintergrund dort reinzunehmen, wo er auch benutzt werden soll.
    body dagegen ist das oberste Element, praktisch das Browserfenster. Es kann nicht das Verhalten eines untergeordneten Elements (wrapper) erben. Deshalb paßten beide Elemente bei bestimmten Breiten nicht mehr zusammen.

    Genau wie Du vorher habe ich es aber bei der Website meines Vereins gemacht. Da ist für body ein Hintergrundbild definiert. Das wollte ich auch wirklich da haben.
    Viele Grüße
    Frank

    Seit Mai 2013 Fan von Contao
    Webmaster vom Deutschen Schachbund und Berliner Schachverband
    Mein Blog: Schachbulle
    Meine Erweiterungen bei GitHub
    Meine Videos auf YouTube: Playlist zur Contao-Programmierung/Einrichtung

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •