WZP Header Animiert V1.1

1. offizieller Beitrag
    Zeta Producer Version
    16.8.6.0

    Hallo zusammen.

    Ich habe o.g. Widget, Anzeige ganze Breite. Die Höhe fürs Bild ist im Container (eben, im Widget selbst) auf 300px gesetzt.


    Nun "zentriert" das Widget jedoch das Foto/Bild in der Mitte von Oben und Unten (und nicht von links und rechts wie beim Text).


    Ich möchte aber den unteren Teil des Fotos angezeigt haben - dort spielt das "Geschehen" ab :)


    Kann ich das mit CSS lösen?? Oder sonst irgendwie?


    Grüsse euch

    Hallo Philipp

    Wow, danke dafür, funktioniert super!


    Zwei Fragen habe ich noch kurz:

    1) Ist es möglich, dass ich alle noch ein wenig, zB 50px oder 10% wieder nach unten verschieben kann?

    2) Oder wenn es einzelne Fotos sind, diese separat um paar Pixel wieder "zurück"-verschieben?


    Grüsse Dich

    • Offizieller Beitrag

    Zu 1) : klar, dafür musst du einfach nur den entsprechenden Wert eintragen, z.B.

    CSS
    <style>
.wzp_anihead {
    background-position: 10px !important;
}
</style>

    Anstelle von 10px kannst du natürlich auch einen beliebigen anderen Pixel-Wert oder auch 10% eintragen.


    2) Das ist ein bisschen komplizierter, dafür brauchst du zu erst die ID des Artikels. Diese kannst du mit den Entwickler-Tools im Browser herausfinden, oder du kannst einen Link auf das Widget setzen und dann die ID aus der URL ablesen (z.B. #a1780 -> ID: 1780).

    Wenn du die ID hast, musst du nur den folgenden Code anpassen. Diesen kannst du dann kopieren und für jeden Header individuelle Wert einstellen:


    CSS
    <style>
.WZP-Artikel_1780.wzp_anihead {
    background-position: 50px !important;
}
</style>

    1780 musst du entsprechend mit der ID des Headers ersetzen.

    CSS
    <style>
.WZP-Artikel_1780.wzp_anihead {
    background-position: 50px !important;
}
</style>

    Hallo Philipp
    Ich komme nun dank deiner Hilfe immer ein Schrittchen näher :D

    Es ist nun so, dass mit diesem einen Wert (zB 50px) ich den nur von UNTEN nach oben schieben möchte.

    Ich habe den Bildausschnitt mit der Höhe 400px und bin mit meinem Ausschnitt mit dem Wert -250px eigentlich gut.
    Nur ist es so, dass mit "-250px !important;" mir das ganze Foto von RECHTS nach LINKS HINAUSSCHIEBT, und NICHT von unten nach oben schiebt um -250px.

    Auch "0 0 -250px 0 !important" geht nicht.

    Woher weiss der, dass es von unten nach oben gemeint ist??

    Grüsse nochmals

    Dominik

  • phil-web

    Hat das Label Behoben hinzugefügt.