CSS - Cadres avec bordures bobbly

Question

Je voudrais faire des images bancales pour les images et le texte dans un site Web (si elles pouvaient se déplacer, ce serait optimal), mais je ne sais pas trop comment le faire. J'ai regardé dans paperjs.org mais je ne suis pas sûr si je peux l'employer pour emballer le texte HTML avec des formes irrégulières. Est-ce que vous connaissez une bibliothèque ou une technique que je pourrais utiliser pour faire cet effet? Ou est-ce peut-être impossible dans l'état actuel du Web?

Answer 1

Un simple mais moins de solution serait de publier votre contenu html avec un z-index de 1, puis placer PNG de l'arrière-plan au-dessus du contenu avec un z-index de 2.

Cela vous permettrait de simuler l'image que vous avez posté mais ne serait pas en mesure d'ajouter une animation de la forme du contenu. Bien que vous puissiez faire pivoter l'arrière-plan vers la gauche ou vers la droite (en simulant l'effet de regarder à travers une fenêtre, en marchant vers la gauche ou la droite).

Si vous vouliez créer le même effet mais avec la possibilité d'animer les formes, vous voudrez sans doute utiliser HTML5 Canvas, mais je ne sais pas exactement comment cela se ferait.