mac: Frage zum Wiki-Artikel „Bildwechsler“

problematische Seite

Hallo zusammen,

im Sinne der Vorstellung möchte ich vorwegschicken, dass es sich bei meiner Person um einen blutigen aber interessierten Anfänger im Bereich html und css handelt.

Nun habe ich mich schon ein wenig mit selfhtml beschäftigt und bin ziemlich begeistert. Ich versuche die theoretische Aneignung und das Prinzip trial and error parallel zu gestalten.

Ich versuche gerade den css-Bildwechsler responsiv zu gestalten, was mir aber nicht gelingen will. Mein Ansatz ist, die Tutorials "Bildwechsler" und "hochauflösende Bilder responsiv darstellen" mit den entsprechenden html- u. css-Angaben zu kombinieren. Wie gesagt bisher erfolglos. Entweder der Bildwechsler bleibt statisch oder die Bilder werden nicht angezeigt. Ich gehe davon aus, dass es für die geschilderte Konstellation Lösungen gibt und mich dürstet danach diese zu kennen. Also falls jemand was in der Schublade bzw. Ideen zur Umsetzung hat bin ich ein dankbarer Abnehmer.

Ansonsten eine entspannte Vorweihnachtszeit und vG, mac

  1. problematische Seite

    @@mac

    im Sinne der Vorstellung möchte ich vorwegschicken, dass es sich bei meiner Person um einen blutigen aber interessierten Anfänger im Bereich html und css handelt.

    Ist A Content Slider von Inclusive Components was für dich?

    LLAP 🖖

    --
    “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
    1. problematische Seite

      Sers Gunnar,

      vielen Dank für Deine Antwort.

      Dieser Content Slider trifft nicht ganz meine Vorstellung. Die einzelnen Fotos sind zwar responsiv, aber der Bildwechsel sollte automatisch erfolgen, ohne interaktive Steuerung und die Fotos sollten immer an der gleichen Position angezeigt werden. Also der Bildwechsel sollte wie beim "statischen" Bildwechsler im Tutorial von statten gehen und zusätzlich sollten sich die einzelnen Fotos dem Viewport anpassen.

      Ciao, mac

      1. problematische Seite

        Hallo mac,

        dazu musst Du zwei Dinge tun:

        1. das figure-Element so ändern, dass es seine Breite seinem Container-Element anpasst. Das kann man mit einer Breite in % oder vw tun - vw hat den Nachteil dass Du nicht genau weißt, welche Ränder in den diversen Containern bis hin zu <html> gesetzt sind. Ich würde % nehmen. Vielleicht 90% und 5% Margin links und rechts?

        2. dem img Element sagen, dass es das padding-Element ausfüllen soll.

        Das war in meinem Eigenversuch erstmal alles.

        Rolf

        --
        sumpsi - posui - clusi