Ankündigung

Einklappen
Keine Ankündigung bisher.

Sticky Sidebar - CSS only

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Sticky Sidebar - CSS only

    Ahoi,

    Es gibt ja bekanntlich die Möglichkeit mittels CSS position:sticky das Verhalten eines HTML Elements zu manipulieren.

    Beispiel Code-Pen dazu: https://codepen.io/anon/pen/xzNXLm

    Dummerweise bekomme ich es dort nicht hin das Verhalten der dort gezeigten Sidebar dahingehend zu manipulieren, das diese einfach solange im normalen Dokumenten-Fluss weiterscrollt bis deren unteres Ende erreicht ist und dort dann anhält.

    Also quasi teilweise genau das Gegentail von dem was die Sidebar in Code-Pen Beispiel tut.

    Es ist für meine Zwecke halt doof wenn man das Ede der Sidebar erst sehen kann wenn man das untere Seiteende fast erreicht hat.

    Hätte jemand eine Idee ob und wie das mit purem CSS geht? Oder muss dann doch JS herhalten? (was eigentlich nicht gewollt ist)
    PHP-Manual ¡ mysql_* ist veraltet ¡ Debugging: Finde DEINE Fehler selbst ¡ Passwort-Hashing ¡ Prepared Statements


  • #2
    Also so ganz checke ich es nicht. Die sidbar soll sich so verhalten wie es jede sidebar halt macht ,einfach da sein und wenn man runterscrollt kommt man irgendwann unten an. Jetzt willst du aber solange Scrollen bis du unten bist ,und dann soll die Sidebar stehen bleiben ,aber der body soll weiter Scrollen wenn es möglich ist?? Ist das soweit richtig ?
    Mein soforthilfe Forum und Chat

    Kommentar


    • #3
      Ein Beispiel dafür (Funktionalität aber leider in JS): https://www.coderblog.de/

      Kommentar


      • #4
        Ichglaube ohne Javascript wird das wohl nicht klappen.Mir fällt zumindest gerade nix ein wie es ohne JS gehen könnte. Was spricht den gegen dieJS Version ?
        Mein soforthilfe Forum und Chat

        Kommentar


        • #5
          Zitat von basti1012 Beitrag anzeigen
          Was spricht den gegen die JS Version?
          Nur die Hoffnung das CSS mittlerweile mehr kann als mein Wissen umfasst.

          Mit JS ist es kein Problem, aber wenn man JS mit CSS ersetzen kann würde ich es nicht ablehnen.

          PHP-Manual ¡ mysql_* ist veraltet ¡ Debugging: Finde DEINE Fehler selbst ¡ Passwort-Hashing ¡ Prepared Statements

          Kommentar


          • #6
            Nested dom levels könnte da was bewirken, die auf der Hand liegende Lösung wäre allerdings in Deine Sidebar unten ein sticky Element einzubauen.
            Wobei ich zugeben muss, von CSS gar keine Ahnung zu haben, und die beiden mayor frameworks ja js dazu nutzen.

            Kommentar

            Lädt...
            X