Seite 1 von 2

Overlay Header

Verfasst: Mi 15. Apr 2026, 22:13
von Volker
Huhu :D

ich hab mal einen Header mit Overlay gebaut.
Gibts die in Mobirise ? Bestimmt :) Aber jetzt dann eben auch mal einen von mir :D





Vorab wie immer nur hier im Forum : https://www.niederastroth.de/overlay-header1.mbrext

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:31
von Tommy Herrmann
Moin,

schöne Idee - aber eben leider wieder nur für den Desktop. Am Handy ist das nix. Da müsse zumindest eine Option rein, den "Layer-Edge" ganz auszuschalten.

Hier meine Testseite (temporär, wird wieder gelöscht):

https://www.mobirise-tutorials.com/Vorl ... -header-6j

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:36
von Volker
Moin Tommy,

du meinst für Handy den layer abschaltbar ? Oder was meinst Du?

Aber sooo schlimm finde ich den am Handy gar nicht ;)

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:37
von Tommy Herrmann
Ja - dass man den Layer wenigstens komplett ausschalten kann um eine vernünftige Darstellung am Handy zu sehen.

So finde ich das nicht gut und auch nicht zu kontrollieren.



Handy-Ansicht:


Overlay-Header von Volker am Handy.jpg


Desktop-Ansicht:


Overlay-Header von Volker am Desktop.jpg

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:38
von Volker
Ich bau den so das bei Handy der Layer raus ist und nur Bild sichtbar.

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:39
von Tommy Herrmann
... denke der Text und der Button sollten schon bleiben, sonst ist das ja kein Header mehr.

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:42
von Volker
https://www.niederastroth.de/demo_1/

Hier die Version die den Layer ausblendet bei Handy

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:46
von Tommy Herrmann
Ja - das sieht am Handy so viel stimmiger aus:


Overlay-Header von Volker am Handy neue Version.jpg


Hier ergibt sich natürlich auch das Problem, dass man eigentlich ein Bild benötigt, das seinen Fokus im rechten Bereich hat. Am Handy sitzt das Bild daher dann nicht besonders gut, da eben zu weit rechts. Da muss man dann etwas suchen, was möglichst gut passt.

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 08:51
von Volker
Ja aber das Problem hats du ja immer am Handy.

hier mit neuen Bild : https://www.niederastroth.de/demo_1/


Besser :D

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 09:27
von Tommy Herrmann
Ja - der bärtige Mann war schon sehr gut - aber egal.

So ist es sicherlich besser. Ist dann eben nur am Desktop "neu" - aber, wie ich finde, gut zu gebrauchen.

Hast Du die .mbrext (Erweiterung) schon getauscht?

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 09:29
von Volker
Ne noch nicht mach ich aber gleich noch - hab noch einen Termin. Sag dann bescheid.

Jetzt ist die mbrext aktuell mit Handy Fix

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 10:53
von Tommy Herrmann
danke - jetzt sitzt aber die Überschrift nicht mittig am Handy (wie es bei Dir zu sehen war):

https://www.mobirise-tutorials.com/Vorl ... -header-6j


neue Handy-Ansicht zweifarbiges Overlay.jpg

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:00
von Volker
Du kannst doch den Text verschieben ;)
Ich hab den jetzt auf meiner Seite mittig stehen ( oder ?)

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

Besser bekomme ich das nicht hin :crying:

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:05
von Tommy Herrmann
... nee - warum sollte es bei dir anders sein :D

Button ist mittig - alle Texte stehen linksbündig.

Auf die Schnelle geguckt steht zwar "mittig" in der CSS aber da macht Dir Mobirise noch einen Strich durch die Rechnung.

Frage mal Tante KI.

Volker neue Handy-Ansicht zweifarbiges Overlay.jpg

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:12
von Volker
Da muss ich mal gucken
jetzt ist aber am Handy mittig !!! Nur am Desktop siehst jetzt kacke aus :D

https://www.niederastroth.de/overlay_header.html
handyansicht1.png
Kannst Du aber auch mal nach gucken ob du ;) das lösen kannst
ich muss jetzt Womo richten ;)

Button mal ausgeblendet - braucht eh keiner ;)

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:19
von Tommy Herrmann
das muss an zwei Stellen ganz entfernt werden:

Code: Alles auswählen

text-align: justify;
für das "h" und das "p" Tag

Bitte nochmals .mbrext erstellen und Bescheid geben.

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:24
von Volker
Es kann manchmal so einfach sein :D

Ändere ich jetzt in der mbrext noch ab.


2 Minuten ....

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:26
von Tommy Herrmann
P.S.:

Einen Button finde ich in jedem Header extrem wichtig :kopfab:

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:35
von Tommy Herrmann
Ich habe festgestellt, dass das gar nicht unbedingt in der CSS steht. Es wird erst beim Klick auf die Platzierung des Textes - also:

Links - Mitte - Rechts

an das jeweilige Tag in der CSS ran geschrieben.

Da ist ein Fehler irgendwo in den Parametern (finde ich aber nicht)

Re: Overlay Header

Verfasst: Do 16. Apr 2026, 11:36
von Volker