Sticky-Element verschwindet hinter folgenden Texten + soll aufhören ab bestimmten Element zu kleben

  • Hallo,

    ich bin noch recht neu in WordPress und bastel gerade an einem Sticky-Kontaktformular, welches am rechten Rand der Seite bis zu einem bestimmten Element kleben bleiben soll und danach dann nicht mehr. Mein genutztes Theme ist Porto und das Kontaktformular, welches kleben bleiben soll, habe ich in das Element Porto Sticky eingefügt.

    Jetzt ergeben sich mir allerdings zwei Probleme:

    • Das Kontaktformular verschwindet während des Scrollens hinter den Texten o.ä von den folgenden Elementen. Grundsätzlich befindet es sich allerdings vor den Elementen, sprich die Hintergrundfarbe von einem folgenden Element wird von dem Kontaktformular überlagert, jedoch liegt das Kontaktformular selbst hinter einem der folgenden Texte, Bilder etc.
    • Leider sind meine Fähigkeiten bei CSS begrenzt und ich konnte noch nicht ganz herausfinden, mit welchem Befehl o.ä. ich es schaffe, dass das Kontaktformular bei einem bestimmten Element aufhört, kleben zu bleiben. Momentan begleitet es mich bis zum Footer.

    Ich hoffe ich konnte das Problem verständlich genug erläutern, ansonsten lade ich auch gerne ein Bild zum Problem hoch, falls das mehr hilft. Falls ein Link von der Seite auch benötigt wird, schicke ich diesen gerne per PM.
    Bisher hatte ich versucht, das Kontaktformular mit einem Custom-CSS-Befehl (Kontaktformular -> höheren z-index als die anderen Elemente) vor den Texten zu positionieren, jedoch hat dies nicht funktioniert.

    Einen Code habe ich nicht, da das Kontaktformular nur in dem Element „Porto Sticky“ liegt und dadurch automatisch festklebt.

    Vielen Dank für eure Hilfe!

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Schön, das du das Forum gefunden hast!
    Grundsätzliches steht hier - LINK besonders (II)
    Bilder helfen zumeist NICHT viel weiter, da sie keinen Code enthalten!
    Ein Link wäre wahrscheinlich die schnellere Hilfe (für dich)!
    Das ist ein öffentliches Forum und Links werden eigentlich als Standard ggf mit einem Link-Shortener bereitgestellt! Über PM wird ein Link NUR in der Jobbörse weitergegeben.

    Wenn du dem Kontaktformular mit einen höheren Z-Index verpasst wird das innerhalb des "Porto Sticky" verwendet. Du kannst versuchen die Class der Porto Sticky zu finden und das Element „Porto Sticky“ mit einem höheren Z-Index zu versehen ....?¿

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • Guten Morgen,

    vielen Dank für die Hilfe. Z-Index hat funktioniert, das Formular überlappt nun auch die anderen Textblöcke. Hier ist auch der Link zu der Website.

    Um noch einmal genauer auf das andere Problem einzugehen:
    Das Formular soll bis zu einem bestimmten Element, in diesem Fall jenes, mit den verschiedenen Projekten, mitgehen und dort dann quasi hängenbleiben und nicht mehr am Rand mitlaufen.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!