Effekt: Scroll-Overlay

Allgemeine Fragen
stobi_de
Moderator
Moderator
Beiträge: 1332
Registriert: Di 11. Okt 2022, 06:30

Effekt: Scroll-Overlay

Ungelesener Beitrag von stobi_de »

https://www.afripix.de/scroll-overlay/index.html

Oft im Netz gesehen, ideal für Fotos in Seiten, die keine Ruhe ausstrahlen müssen.
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7758
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von Tommy Herrmann »

Moin,

gefällt mir gut :tu:

Vielleicht sollte der farbige Balken im Header eine leichte Transparenz erhalten.


P.S.:

… habe da gerade mal eine animierte Linie hinzugefügt (zwischen den Buttons) - nur falls Du so etwas mal brauchen könntest:

https://www.mobirise-tutorials.com/Tuto ... l#Tutorial

Code: Alles auswählen

#lineh1 {
  position: relative;
  margin-bottom: 28px;
  left: 0;
  height: 2px;
  background: #5500AA;
  animation: lineH 8s 2s infinite linear;
}
@keyframes lineH {
  0% {
    width: 0%;
    opacity: 1;
  }
  80% {
    width: 100%;
    opacity: 1;
  }
  100% {
    width: 100%;
    opacity: 0;
  }
}

Anzeige außerhalb der Mobirise-Klassen:

Code: Alles auswählen

<div id="lineh1"></div>
stobi_de
Moderator
Moderator
Beiträge: 1332
Registriert: Di 11. Okt 2022, 06:30

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von stobi_de »

So ne Linie benutze ich sogar recht oft :)

Farbe des drüber-huschenden Balkens darf in diesem Fall mal nicht transparent sein (mit meiner Konstruktion hier), weil der Hintergrund eingeschaltet wird, wenn der Balken das Div komplett abdeckt.
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7758
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von Tommy Herrmann »

echt - habe noch nie eine solche animierte Linie, die sich von links nach rechts aufbaut und am Ende sanft ausblendet, auf Deinen Seiten entdeckt :confused:
stobi_de
Moderator
Moderator
Beiträge: 1332
Registriert: Di 11. Okt 2022, 06:30

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von stobi_de »

So ähnlich und etwas dezenter
https://www.sportnahrung-mangold.de/
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7758
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von Tommy Herrmann »

Manno - da hätte ich das ja bei Dir abkupfern können, anstatt mit der KI zu plaudern :D
stobi_de
Moderator
Moderator
Beiträge: 1332
Registriert: Di 11. Okt 2022, 06:30

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von stobi_de »

Von Rudy.
Aber sowohl die Buttons wie auch das Scroll-Overlay oder die vergrößerung: alls Mr. Chat.
Eigenes Gehirn wird nur noch für Planung benutzt
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7758
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von Tommy Herrmann »

… dafür hat meine animierte Linie nun noch einen Bullet vorangestellt bekommen - ätsch :prost:

https://www.mobirise-tutorials.com/Tuto ... l#Tutorial
stobi_de
Moderator
Moderator
Beiträge: 1332
Registriert: Di 11. Okt 2022, 06:30

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von stobi_de »

Mach das Ganze als Herzrhythmus - Kurve und man kann es für eine Arzt-Seite gebrauchen.
So ist es halt für ein Bestattungsunternehmen :D
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7758
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von Tommy Herrmann »

:eek: :P
Nachtfalke
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 177
Registriert: Mi 16. Dez 2020, 18:48
Wohnort: Main-Kinzig-Kreis, Hessen
Kontaktdaten:

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von Nachtfalke »

stobi_de hat geschrieben: Fr 13. Jun 2025, 05:50 Mach das Ganze als Herzrhythmus - Kurve und man kann es für eine Arzt-Seite gebrauchen.
So ist es halt für ein Bestattungsunternehmen :D
😂😂😂 das finde ich ja richtig gut
Mobirise v6.1.4

Gruß
Dieter
stobi_de
Moderator
Moderator
Beiträge: 1332
Registriert: Di 11. Okt 2022, 06:30

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von stobi_de »

Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 7758
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Effekt: Scroll-Overlay

Ungelesener Beitrag von Tommy Herrmann »

ja - nur mit dem großen Vorteil, dass man mit solchen Versuchen eine Menge lernt :tu:

Bei mir ist auch noch eine Glow-Linie dazu gekommen :)

https://www.mobirise-tutorials.com/Tuto ... #Glow-Line

... zusätzlich habe ich auch noch einen Stopp bei Mausüber via CSS eingebaut.


Animation von Buttons und Linien.jpg
Antworten

Wer ist online?

Mitglieder in diesem Forum: Amazon [Bot] und 6 Gäste