GSAP Draggable Effect

How to add it to your website

1-add custom code to page settings (before </body> tag).



<script>
  gsap.registerPlugin(Draggable);

  document.addEventListener("DOMContentLoaded", function () {
    const cards = document.querySelectorAll(".home-card");

    cards.forEach(card => {
      card.style.willChange = "transform";
      card.style.transformStyle = "preserve-3d";
    });

    gsap.set(".home-card", { force3D: true });

    Draggable.create(".home-card", {
      type: "x,y",
      edgeResistance: 0.2,
      inertia: true,
      bounds: ".hero-section",
      zIndexBoost: false
    });
  });
</script>

2-style the code embed.