Point d'origine

Point d'origine

Lorsque nous agrandissons un élément au survol, l'agrandissement prend effet à partir d'un point d'origine, qui est pas défaut l'angle haut/gauche; pour la rotation, c'est le centre !

Ce point d'origine n'est pas toujours le bon, selon la position de l'élément.

<div id="fd1">
<p id="po1"> </p>
</div>
<style></style>

Lorsque nous plaçons notre élément ailleurs que dans l'angle haut/gauche, le point d'origine par défaut ne convient plus
Nous allons imposer un autre point d'origine et, dans ce cas, ce sera l'angle bas/gauche

Lorsque nous voulons voir l'agrandissement partir, par exemple, depuis l'angle bas/gauche:
<div id="fd3">
<p id="po3"> </p>
</div>
<style></style>

L'écriture de transform-origin tolère les mots, les pixels et les pourcentages.

Ce qui va nous permettre de réaliser ce genre de présentation, en utilisant une autre page déjà publiée: position:absolute; z-index:2;
<div id="fd4">
<p id="po4"> </p>
<p id="po5"> </p>
<p id="po6"> </p>
<p id="po7"> </p>
</div>
<style></style>