Image Carrousel

This is the code I used for the image carousel. Credits for Wareti! (I used their code as a base and edited the photos.)

 For this code, it's not too difficult just takes a little time, I edited the photos on Canva with little videos on them and then saved each one as a gif (you have to save each photo separately, or it is saved as one long gif). I used remove.bg to add the little images. Then you just have to upload the gifs to giphy.com, copy the link to the gif, and change it on the code. Voila! You have your own customized carousel!

Have fun!

xoxo, mirabilis

<!-- (c) Layout created by wareti (https://layouts.spacehey.com/layout?id=94020, cat slide show) -->

<style>

    .slideshow-container1234 {

      position: relative;

      max-width: 100%;

      overflow: hidden;

    }

    .slides1234 {

      display: flex;

      animation: slide1234 15s infinite;

    }

    .slides1234 img {

      width: 100%;

      height: auto;

      display: block;

    }

    @keyframes slide1234 {

      0% { transform: translateX(0); }

      20% { transform: translateX(-100%); }

      40% { transform: translateX(-200%); }

      60% { transform: translateX(-300%); }

      80% { transform: translateX(-400%); }

      100% { transform: translateX(-500%); }

    }

  </style>

  <div class="slideshow-container1234">

    <div class="slides1234">

      <img src="UR URL HERE"/>

      <img src="UR URL HERE"/>

      <img src="UR URL HERE"/>

      <img src="UR URL HERE"/>

      <img src="UR URL HERE"/>

    </div>