Hallo! Ich habe leider schon alles probiert was man hier findet. Vielleicht gibt es ja eine Lösung ich wäre euch sehr dankbar. Ich würde gerne 3 Bilder auf meiner Startseite mit den Effekt ( welcher im Testshop 2 bei den 3 Bildern mit einem Hover - Mouse fährt drüber und dann wird ein kleiner Zoom dargestellt) haben. Ich sag schon jetzt mal danke! Christof
Ich mir das grade aus Interesse auch mal angesehen, komme aber auch nicht weiter... Also im StyleEdit CSS steht schon mal nix dazu. Im Content beziehen sich die Bilder auf eine CSS Klasse: Code: <div class="col-xs-12 col-md-8 row-xs-2 row-md-2"> <a class="home-teaser" href="kinder-babys/"><img alt="" class="img-responsive" src="images/content/index/teaser.jpg"</a> </div> Nur: Wir kommen ja nicht an die Dateistruktur des Testshops ran um dort irgendwelche .scss Dateien zu checken, oder? Ich hole die Frage deswegen wieder hoch: wie ist das eingebunden?
In Chrome oder FireFox mit der Rechten MAustaste auf das bild gehen und "Untersuchen" auswählen - und schon hat man das css Code: .home-teaser { position: absolute; height: calc(100% - 15px); width: calc(100% - 15px); display: block; left: 7px; top: 7px; background: transparent 50% 50% no-repeat; background-size: cover; overflow: hidden; } und Code: .home-teaser > div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent 50% 50% no-repeat; background-size: cover; -webkit-transition: 300ms ease all; -o-transition: 300ms ease all; transition: 300ms ease all; }
Was soll ich sagen Barbara wie immer on top! Reicht aber anscheinend noch nicht ganz für den gewünschten Effekt, aber ist ein guter Ansatz zum Weitersuchen...