Logo-Scal wird bei Top Resposive nicht im Vordergrund angezeigt

1. offizieller Beitrag

    Ich habe das Problem beim Layout Top-Responsive, dass das Logo bei "Logo-Scal" nicht als erstes oben auf der Seite sichtbar (im Vordergrund) platziert wird, sondern die TOPLINE im Layout (Navigation des Layouts) weiter im Vordergrund bleibt und somit das Logo darunter nur abgeschnitten erscheint. Ich vermute es hat ggf. etwas mit dem Z-INDEX zu tun, habe den Wert schon in alle möglichen Richtung verändert, jedoch ohne Erfolg. :(

    • Offizieller Beitrag

    Normalerweise bist du mit "z-index" auf dem richtigen Weg. Aber in Top-Responsive verhält sich das etwas anders. Platziere das Widget m Bannerbereich.


    Am schnellsten geht das so:

    • Schalte mit "F8" in den Spaltenmodus
    • Rechtsklick auf das Widget "Logo-Scal" > ausschneiden
    • Rechtsklick in die Spalte "Banner" > einfügen.
    • Schalte mit "F8" zurück in die "Live-Ansicht"

    Das Problem beim Einfügen in den Banner ist jedoch, dass nun eine "unschöne" Leerzeile entsteht durch das Widget, d.h. beim Herunterscrollen hat die eigentlich feste Topline plötzlich einen Scrollspace...

    • Offizieller Beitrag

    Das Problem lässt sich normalerweise beheben indem man das Widget mit einem Anderen in eine Reihe packt. Wenn da kein weiterer Artikel ist geht das natürlich nicht.


    Du könntest folgenden Code probieren, den Quelltext aber nicht über des Widget" Quelltext" sondern über das Attrtibut "footer_script einfügen. https://www.code-zp.de/logo-skalieren.html (ungetestet, kann sein das dann der alte Fehler wieder auftritt).

    Danke für deine Mühen, aber ich werde wohl das Widget nicht nutzen können - ich dachte es wäre responsive, aber wenn man das Webfenster in der Größe verändert (z.B. horizontal verkleinert) und man einen gewissen Abstand zum Rand beim Logo eingestellt hat, flutscht das Logo nach rechts weiter und landet irgendwann in der Navigation. Lässt sich wahrscheinlich auch nicht anders lösen denke ich. Das Standard Logo von ZETA im Layout bleibt felsenfest da wo es ist bzw. verschiebt sich responsive mit, hat nur leider nicht diese schöne Scale Funktion... :(

    • Offizieller Beitrag

    Ich bin gerade unterwegs. Aber ich bin der Meinung das dies daher kommt weil ich hier extra die Möglichkeit gegeben habe das Logo für Mobile neu zu positionieren und die Grösse zu ändern.


    Schau Mal da gibt es doch sicher eine Gruppe "Mobile" im Widget.


    Wenn du das Statisch haben willst gib da einfach die gleichen Daten ein oder setze den Breakpoint auf 1px

    Das Beispiel mit dem Code (CSS / HTML) funktioniert bei mir - allerdings stehe ich jetzt auf dem Schlauch, wie ich das Logo für meinen Bedarf positionieren kann, z.B. weiter nach rechts und in der Höhe. Muss das was hinzugefügt werden? Ich vermute für mobile müsste man es dann auch extra anpassen...


    Nochmal zum "Widget Logo-Scal". Hast Du eine Idee wieso das "Widget Top-Bar" nicht mehr funktioniert, wenn ich "Logo-Sacal" in den Bannerbereich einfüge? Die Top-Bar erscheint dann einfach nicht mehr.


    Und mal ganz blöd gefragt. Kann man nicht mit CSS irgendwie das Original Logo aus dem Layout Top-Responsive mit dieser Scale Funktion ausrüsten? Das würde alles wahrscheinlich vereinfachen, kann aber auch sein, dass ich da total falsch liege.

    • Offizieller Beitrag
    Zitat von mksteinmetz

    Das Beispiel mit dem Code (CSS / HTML) funktioniert bei mir - allerdings stehe ich jetzt auf dem Schlauch, wie ich das Logo für meinen Bedarf positionieren kann, z.B. weiter nach rechts und in der Höhe. Muss das was hinzugefügt werden? Ich vermute für mobile müsste man es dann auch extra anpassen...

    Ja ich habe da die horizontale Position weggelassen damit es in Inahltsbreite links abgebildet wird.

    Ändere dieses:

    Code
    .zp-logo-block {
position: fixed;
top: 0px;
z-index: 6100;
transition: top 0.2s ease 0s;
}

    in:

    top: 20px; left:80px; sind dann die Positionen vom Bildschirmrand.





    Zitat von mksteinmetz

    Nochmal zum "Widget Logo-Scal". Hast Du eine Idee wieso das "Widget Top-Bar" nicht mehr funktioniert, wenn ich "Logo-Sacal" in den Bannerbereich einfüge? Die Top-Bar erscheint dann einfach nicht mehr.

    Nein weiß ich auch nicht. Top ist bei Änderungen im Kopfbereich schon sehr speziell.





    Zitat von mksteinmetz

    Und mal ganz blöd gefragt. Kann man nicht mit CSS irgendwie das Original Logo aus dem Layout Top-Responsive mit dieser Scale Funktion ausrüsten? Das würde alles wahrscheinlich vereinfachen, kann aber auch sein, dass ich da total falsch liege.

    Theoretisch sollte das Möglich sein. Da steckt aber schon einiges an Arbeit drin. Neben CSS muss da auch JS eingesetzt werden.

    Ich kämpfe immer noch mit dem Widget Logo-Scal - wenn ich die Position Links in % beim Bild einstelle, werden diese Werte ja auch für mobil übernommen. Das ist mein Problem - die Position links in Px bei mobil ist dann ohne Funktion? Verstehe die Einstellungen nicht - ich dachte man kann für Desktop / mobil separat einstellen oder täusche ich mich da? Wenn ich bei Bild z.B. Position links 20% einstelle, dann schiebt sich das Logo in der mobilen Fassung ebenfalls nach links, obwohl da ein anderer Wert (px) steht...