Growing cards

Suite de la partie sur les cartes. Voici une nouvelle découverte. C'est une carte assez minimaliste qui s'agrandit au survol et dont l'image couvre toute la partie de la carte. On pourrait imaginer cette carte pour la partie "catégorie" d'un blog ou bien tout simplement en introduction d'un article.

Les cartes sont un excellent moyen de présenter les produits, les membres de l'équipe, les services et les points clés. Ils peuvent être utilisés sur votre site Web ou sur les réseaux sociaux pour mettre en valeur le meilleur de votre entreprise. Les cartes peuvent également être animées pour montrer le mouvement et l'excitation.

Une carte est généralement composée d'une image ou d'une vidéo avec une brève description de l'élément ainsi qu'un bouton d'appel à l'action sur lequel le spectateur peut cliquer et explorer l'article complet. Cela fait des cartes un excellent choix pour présenter des articles de blog, des éléments de portfolio et des produits.

+ Point(s) clé(s):

Ici pas de de Javascript, juste du CSS. Il faut faire attention de bien positionner l'image dans la carte, ici un padding en bas remonte l'image et laisse la place pour les titres. Tout est une question de petits réglages (position absolue, relative ou le Z-index) qui rendent l'animation assez sympathique.