Want to create interactive content? It’s easy in Genially!

Get started free

Flip-Flip

Lorenzo Tempesti - F

Created on January 28, 2024

Start designing with a free template

Discover more than 1500 professional designs like these:

Teaching Challenge: Transform Your Classroom

Frayer Model

Math Calculations

Interactive QR Code Generator

Interactive Scoreboard

Interactive Bingo

Interactive Hangman

Explore all templates

Transcript

FLIP -

FLIP

V 1.2 du 13/06/20

L'exemple

Extension proposée par Patrice Nadam

Le Principe

Fonctions permettant la transformation des images

(Supprimez les transformations non désirées)

Groupez chacun de ces objets à un élément Genially (image, forme, texte...)

Possibilité de les dupliquer autant de fois que nécessaire...Supprimer les Objets non utilisés (Ne pas les placer hors de la page)

Pour voir la page dans sa totalité, cliquez sur Réutiliser ce Genially

ROTATION DE 90°

Fonctions permettant la transformation des images

(Supprimez les transformations non désirées)

Groupez chacun de ces objets à un élément Genially (image, forme, texte...)

Possibilité de les dupliquer autant de fois que nécessaire...Supprimer les Objets non utilisés (Ne pas les placer hors de la page)

LE CODE

<div style="color:red">FONCTION flipX</div> <script> var x = document.querySelectorAll(".flipx"); for (var i=0;i< x.length;i++) { var objet=x[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode; if (objet.getAttribute("id")==null) { objet=x[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode; } if (objet.getAttribute("id").search("genially-animated") ==0) { objet.style.transform = "scaleX(-1)"; } } </script>

<div class="flipx" style="color:red;font-size:20px;">flipX</div> <script></script>

<div style="color:green">FONCTION flipY</div> <script> var x = document.querySelectorAll(".flipy"); for (var i=0;i< x.length;i++) { var objet=x[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode; if (objet.getAttribute("id")==null) { objet=x[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode; } if (objet.getAttribute("id").search("genially-animated") ==0) { objet.style.transform = "scaleY(-1)"; } } </script>

<div style="color:green;font-size:20px;" class="flipy">flipY</div> <script></script>