Media Bounce

Media Bounce

Type

Component

Plateforme

Framer

Créé en

2026

Type

Component

Plateforme

Framer

Créé en

2026

11
1

Le DVD screensaver revisité : une image ou vidéo flotte dans son cadre, rebondit sur les bords et cède la place au média suivant, en boucle

Media Bounce rejoue l’économiseur d’écran DVD sur votre canvas. Une image ou une vidéo dérive dans le cadre, rebondit sur chaque bord et laisse place au média suivant de la liste, en boucle. Position, direction et angle de départ sont tirés au hasard à chaque chargement.

Trois leviers pour l’adapter : la fréquence de changement (à chaque rebond, ou tous les 2 à 10), le mélange libre d’images et de vidéos dans une seule liste, et une taille par média ou globale. Le fond se règle en couleur, image ou vidéo, avec vitesse, radius, border optionnelle et pause au hover.

Mouvement et rebond

  • Dérive et rebonds bord à bord, façon DVD screensaver

  • Position, direction et angle de départ aléatoires à chaque chargement

  • Vitesse réglable, pause au hover optionnelle, rebond qui suit les coins arrondis

Vos images et vidéos

  • Upload ou URL pour les images, vidéos et posters

  • Taille globale, ou taille custom par média pour varier les ratios

  • Le média reste contenu dans le cadre, sans débordement ni coupe

Fond et cadre

  • Fond solid, image ou vidéo, en upload ou par URL

  • Opacité du fond et poster optionnel derrière le média

  • Radius séparés pour le cadre et le média, border optionnelle

Chargement et performance

  • Images et posters préchargés, la vidéo suivante se bufferise en avance

  • Vidéos muted en loop, en pause hors du viewport

  • Preview statique sur le canvas