← EffetsStudio Chardon Lab

CHARDON FX / ÉTUDE VISUELLE

Une image,
tout l’écran.

Faites défiler pour ouvrir l’image ↓

Lac alpin à l’aube, forêt de pins reflétée
Le premier regard

06 / Ouverture · CSS 3D · scroll natif

Image plein écran

Une image qui s’ouvre comme une porte.

Inclinée en perspective, l’image se redresse et s’agrandit jusqu’à occuper tout l’écran au fil du défilement.

Où l’utiliser

Hôtels, immobilier, restaurants, mode : ouvrir sur la photo qui résume le lieu.

Notre regard

Une seule image forte suffit. À placer juste après l’accueil, pour faire entrer le visiteur dans l’univers.

À essayer

Faites défiler la page : l’image se redresse, puis occupe tout l’écran.

Une lecture adaptée

En mouvement réduit, l’image s’affiche directement en plein écran.

Étude visuelle de démonstration. Images générées pour le Lab.

Base d’intégration
<section data-fx="tilt-reveal" data-length="2.4" data-tilt="26">
  <figure><img src="lieu.webp" alt="Description"><figcaption>Légende</figcaption></figure>
</section>

Utiliser ensemble chardon-fx.css et chardon-fx.js. Adapter les médias et les couleurs au projet, puis vérifier sur les appareils cibles.