Transform


support
Dutch English French German

Rotate

mobile_script

<style>

.image1 {

transition: transform 0.7s;

}


.image1:hover {

transform: rotate(360deg);

}

</style>

Inhaltsbereich

ZB. ein Bild per Textabsatz einbinden und anschließend auf (HTML-Quellcode umschalten). Den Abschnitt class="singleImage" durch class="image1" ersetzen.

 

Oder ein Bild per Widget Quelltext nach folgendem Schema einfügen:

<a href="http://www.zeta-producer.com/"><img class="image1" border="0" alt=""  src="http://www.deinbild.jpg" /></a>

Translate

 

mobile_script

<style>

.image2 {

transition: transform 0.7s;

}


.image2:hover {

transform: translate(45px, 0px);

}

</style>

Inhaltsbereich

ZB. ein Bild per Textabsatz einbinden und anschließend auf (HTML-Quellcode umschalten). Den Abschnitt class="singleImage" durch class="image2" ersetzen.

 

Oder ein Bild per Widget Quelltext nach folgendem Schema einfügen:

<a href="http://www.zeta-producer.com/"><img class="image2" border="0" alt=""  src="http://www.deinbild.jpg" /></a>

Scale

 

mobile_script

<style>

.image3 {

transition: transform 0.7s;

}


.image3:hover {

transform: scale(.5, .5);

}

</style>

Inhaltsbereich

ZB. ein Bild per Textabsatz einbinden und anschließend auf (HTML-Quellcode umschalten). Den Abschnitt class="singleImage" durch class="image3" ersetzen.

 

Oder ein Bild per Widget Quelltext nach folgendem Schema einfügen:

<a href="http://www.zeta-producer.com/"><img class="image3" border="0" alt=""  src="http://www.deinbild.jpg" /></a>