Rollover Header Block

[Volker]

Huhu

Es gibt wieder was mit Rollover

Ich hab das mal in einen Header Block gepackt - sieht auch nicht schlecht aus - oder ?




https://www.niederastroth.de/rollover_headerhtml.html

[Tommy Herrmann]

Ja - da hatte ich auch schon drüber nachgedacht, ist nun aber genau wie vermutet vielleicht etwas am Thema vorbei. Im Header finde ich letztendlich einen automatisch wechselnden Hintergrund besser:

https://www.mobirise-tutorials.com/Tuto ... lider.html

Oder auch mit Videos (stoppt bei Mausüber):

https://www.mobirise-tutorials.com/Tuto ... Video.html

Genau aus diesem Grund habe ich bei meinen beiden Beispielen (oben) den Header eben am Handy proportional verkleinert und nicht als "cover" am Handy verwendet. Dort dann eben auch entsprechend die Text-Layer ganz weggelassen.

... aber egal, man kann natürlich beides machen.

Am Handy fände ich es ganz gut, wenn man den Text-Layer wegklicken könnte und dieser dann nach dem Wechsel der Bilder zurückkehrt, denn man sieht am Handy ja sonst das eigentliche Bild gar nicht mehr.

Außerdem steht die Schrift am Bild 2 irgendwie falsch und nicht mittig, siehe Screenshot:

[Volker]

Hi Tommy,

ich habe es geändert - Schrift mittig und nun kann man auch am Handy per Tipp wieder das Bild wechseln.
War gar nicht so einfach

[Tommy Herrmann]

Moin,

ja - da hatte sich mein ChatGPT auch schwer mit getan und es geht wohl nur über JavaScript und das nicht so ganz zuverlässig am Handy, daher habe ich schlussendlich darauf verzichtet. ChatGPT hat auch manchmal schlechte Tage und hatte bei mir mit dem zusätzlichen JavaScript mal wieder die gesamte Anwendung zerschossen. Da hatte ich dann auch keine Lust mehr.

Eigentlich ist es ja auch Standard, dass man am Handy den zweiten Tipp eben auf den Hintergrund macht und nicht erneut auf das Objekt. Schließlich weiß ja jeder, dass es am Handy kein Mouseover (Mausüber) gibt.

So ist es aber besser, ich finde die Text-Layer als Header-Block ja ein wenig groß am Handy - aber das ist natürlich jedermanns Geschmackssache. Ich sehe die Text-Layer am Handy eher auf der unteren Hälfte oder sogar nur im unteren Drittel, damit das Bild als Header-Block eben noch die Hauptsache bleibt.

[Volker]

Moin Tommy,

ich hab die Cards jetzt per Schieber nach unten verlegt und auch verschiedene Größen im Zahnrad. Klar am Handy ist das immer etwas kacke, aber ich wollte es technisch schaffen

Das ist jetzt also das Endresultat : https://www.niederastroth.de/rollover_headerhtml.html

Man sieht ja eh am Handy nie das ganze Bild wie am PC

[Tommy Herrmann]

Moin,

ich glaube es ist besser geworden

… am Handy ist das Header Bild nun aber ganz schön riesig geworden, sodass man sogar scrollen muss, um den Text lesen zu können. Na ja - an meinem Laptop eigentlich auch:

Aber egal - glaube so ist es besser und auch mal anders.

[Volker]

Alternative mit 4 Bildern

https://www.niederastroth.de/header01/

Da ist dann immer ein mindestens gut zu sehen

Aber da will ich einegtlich jedes bild automatisch mit effekt ersetzen das es nacheinander geht .... da bin ich gerade dran.

So in der Art: https://www.niederastroth.de/header02/

[Tommy Herrmann]

Ich glaube Deine "Automatische Kette" gefällt mir besser

[Volker]

Ja wie ? Gefällt Dir nicht ?
Ich finde das stylisch

https://www.niederastroth.de/header02/

Da will ich mal probieren für jedes bild eine andere Einblendung zu machen ...

Klappt

Hau ich auch mal al Block raus - nach dem Einlaufen