Stylé : ce château fort responsive adapte sa structure à la taille de votre écran !

Hello World! En ce début de semaine, je vous partage une petite trouvaille faite sur les Internets et également vue au cours d'un de mes lives Twitch il n'y a pas si longtemps (d'ailleurs, pensez à suivre ma chaîne ! 😉).

Pour le plaisir, le développeur web Vast Rideside a mis au point une création (HTML + CSS + JS) portant sur un château fort responsive.

Le principe ? Le bâtiment adapte sa structure en fonction de la fenêtre de votre navigateur : en jouant avec la hauteur mais aussi la largeur de votre fenêtre, son nombre de tours et leur hauteur évoluent, tout comme le paysage qui les entoure, la classe n'est-ce pas ?

Ce projet est hébergé sur la célèbre plateforme de partage d'extraits de code web CodePen. Vous pouvez le consulter en version intégrale dans votre navigateur en cliquant ici. Pour consulter les fenêtres embarquant le code source, ça se passe ici.

Dans un tweet où il partage sa création, Vast Rideside avoue avoir passé un temps fou à créer et organiser son fichier Adobe Illustrator sur lequel s'appuient ses visuels, et vu tous les éléments embarqués dans ce projet, on veut bien le croire !

À noter que le développeur n'en est pas à son coup d'essai sur ce type de rendu, puisqu'il avait déjà partagé l'année dernière une île responsive sur laquelle reposent de petites chaumières et des moulins.

Suivre Les Joies du Code sur Twitter