Slider im Header bei mob Ansicht durch ein einzelnes Bild ersetzen

  • Ich möchte den Slider im Header bei mobiler Ansicht < 380 px ausblenden und nur ein einzelnes kleineres Bild anzeigen. Bei zella codeschnipsel habe ich sowas zwar gsehen, aber ich möchte bei der Tablet und Desktobansicht nicht auf den Slider verzichten.
    Kann ich das irgendwie mit media steuern?


    Freundliche Grüsse

    Fuj




    Flat responsive, Business, Version 15.01

    • Gebe dem Slider die CSS-Klasse: head-slider
    • Importiere dein Bild für die Mobile Ansicht in die Bildverwaltung.
    • Bild > Eigenschaften > Weiteres > Bild schützen
    • Bild > Mehr > Objekt-ID kopieren und diese im Win-Editor zwischenlagern


    Einstellungen > CSS:



    Direkt unter dem Slider Widget > Quelltext mit folgendem Inhalt:

    Code
    <div class="head-mobile">
    <img src="oid://image/deinbild">
    </div>


    • Den Teil oid://image/deinbild austauschen mit der Objekt-ID aus dem Win-Editor.
    • Der Artikel bekommt die CSS-Klasse: zpBreakout und das Inline-CSS: margin-top:-2em
    • Das margin-top:-2em musst du je nach Layout-Einstellungen noch anpassen.
    • Das Widget Quelltext lässt sich anschließend nur über die Spalten-Ansicht aufrufen.
  • Ich frage mich ja immer, warum sollte ein Teil der Information einer Website für einen Besucher mit einem Tablett interessant sein, für einen Besucher mit einem Smartphone aber nicht? Warum stellt man abhängig vom Gerät unterschiedliche Inhalte bereit?

  • Da hast du natürlich grundsätzlich recht.

    Aber:

    1. Mit dem Smartphone ist man oft mit Mobilen Daten unterwegs. Hier ist es der Performance sicher zuträglich wenn anstatt vieler großer Bilder nur ein kleines geladen werden muss.
    2. Von einem Breitbild-Format welches am Desktop (bei Randlos) gut aussieht kann man am Smartphone in der Regel nicht mehr viel erkennen. Hier macht es Sinn ein anderes Format zu wählen. In den Headern der neueren Layouts ist das auch super gelöst. Dies macht allerdings nur Sinn wenn der Focus der Bilder in der Mitte liegt. Blende ich ein neues Bild ein kann ich den Fokus selbst bestimmen.


    PS: zu1. Viele kleine Bilder der Originale wären natürlich auch prima. Bildergrößen

  • Herzlichen Dank für die Informationen.
    Es ist tatsächli so, dass der Fokus des gewünschten Bildes rechts hat und das nur beim Drehen des Handy auch sichtbar wäre. Nur eben, wer dreht schon sein Handy.

    Ansonsten ist der Inhalt natürlich identisch.

    Gruss

    Fjo