Bienvenue dans mon premier billet de Blog

Ça fait maintenant deux semaines que l’ACS Nevers a commencé. La première semaine était plutôt calme avec la création et la présentation de notre avatar sur les réseaux sociaux . Puis nous avons dû réaliser notre première page HTML avec pour objectif de présenter notre avatar. Mais bon il ne faut pas se le cacher il ne ressemblait pas à grand chose car sans CSS les sites web ressemblent plutôt à… Non c’est vrai ça ne ressemble à rien.

Mais cette deuxième semaine était déjà plus compliquée car j’ai vu l’apparition du CSS. Heureusement pour moi je n’étais pas le seul car nous avons travaillé en groupe de trois pour créer notre « premier » vrai site avec HTML et CSS. Mais bien sûr comme je suis un guerrier persévérant j’ai pensé à rajouter une animation sur notre site web en CSS.  C’était extrêmement difficile, mais après plusieurs heures de recherche et beaucoup de cheveux en moins  (d’ailleurs il ne m’en reste plus MERCI L’ACS !),  j’ai ENFIN réussi mon animation sur le site.
Voici l’animation :
Au début nous avions deux cadres l’un à côté de l’autre comme ci-dessous.

Au passage de la souris sur le bloc de droite celui-ci s’agrandit en se déplaçant juste sur la gauche et l’image de gauche passe sous l’autre bloc.

Pour vous expliquer un petit peu le code j’ai créé deux div. Une qui contient l’image (bloc de gauche) et l’autre qui contient le texte et les liens (bloc de droite). Ensuite sur le CSS j’ai utilisé le :hover sur le bloc de droite qui me lance mon animation.

Voici une petite partie de mon code :

Mon hover :

Mon animation : 

Le code n’est pas très long et  j’ai passé plusieurs heures dessus pour faire au final quelque chose d’assez simple, mais j’ai rencontré pas mal de problèmes comme :

  • L’image ou le bloc texte qui passait en dessous.
  • Le bloc texte ne se positionnait jamais correctement et semblait décalé par rapport aux autres.
  • L’animation ne restait pas bloquée à la fin et revenait à sa position initiale.

Mais heureusement pour moi j’ai résolu ces problèmes.

Je finis cette semaine en écrivant ce petit billet pour le blog.

Je vous dis à la semaine prochaine pour savoir si je suis devenu chauve.

 

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *