Um schreiben oder kommentieren zu können, benötigen Sie ein Benutzerkonto.
Sie haben schon ein Benutzerkonto? Melden Sie sich hier an.
Jetzt anmeldenHier können Sie ein neues Benutzerkonto erstellen.
Neues Benutzerkonto erstellen
Hallo!
Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.
Sowas nennt man Flipbox. Beispiele gibt es z. B. hier:
https://codepen.io/syedrafeeq/pen/eCkFt
https://codepen.io/desandro/pen/LmWoWe
Meinen zweiten Link hast du gesehen? Der ist schon mit Click. Und wenn du bei transition:transform 0s schreibst, hast du keine Animation.
Dazu bräuchten wir einen Link zu deiner Seite.
im Grund ist es das gleiche wie hier, hab's nur um ein Zweites erweitert und auch den JS-Code dupliziert:
https://codepen.io/moellerfeuer/pen/vawmde
Es scheint so zu gehen.
Aber bei 8 Kacheln bläht es den Code halt auf.
Wäre schön, wenn man nur 1 gleichzeitig umdrehen könnte 
Versuch es so: https://codepen.io/anon/pen/ZjNxMK
Danke nochmals
..Ansich super, hab es hinbekommen. Aber im Safari funktioniert es nicht, da spiegelt sich die front nur 
Betrifft Desktop und mobile. Firefox/Chrome funktioniert.
Gib uns mal einen Link. Ich selber nutze den Safari nicht. Aber evtl. kann hier jemand anderes helfen.
Versuch mal bei .card__face noch zusätzlich -webkit-backface-visibility: hidden;
Gib uns einen Link zur Seite, dann könnten wir mal schauen was stört.
Du hast jquery 1.12.4 (Original WordPress) und 3.3.1 (Cloudflare). Wenn ich deine Version in codepen.io teste, läuft die auch mit 1.12.4. Du brauchst mMn die Version 3.3.1 nicht.
Versuch dein Script mal so in etwa einzubinden:
<script>
jQuery(document).ready(function($) {
$(".card").click(function(){
$(this).toggleClass('is-flipped')
});
});
</script>Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!