因此，我是新的帧运动和一些文章的帮助下，我试图错开文本，并使我的投资组合的文本显示动画，但与每一个例子，我可能会发现，我不能错开句子的个别字符和整个动画发生simuvant的所有字符在句子中。此外，当我设置循环的句子，使我可以得到个别字符的<motion.span>标签，然后y轴动画发生时，句子是作为一个整体，也不工作，只有动画作品是不透明的，也没有交错。
代码：

"use client";
import { Variants, motion } from "framer-motion";

const MainHeading = () => {
  const textVariant: Variants = {
    hidden: {
      opacity: 0,
      y: "80",
    },
    visible: {
      y: 0,
      opacity: 1,
      transition: {
        ease: "easeInOut",
      },
    },
  };

  const textContainerVariant: Variants = {
    hidden: {
      opacity: 0,
      y: "80",
    },
    visible: {
      y: 0,
      opacity: 1,
      transition: {
        staggerChildren: 0.5,
        delayChildren: 0.5,
      },
    },
  };

  const headingLine = "Full Stack Web Dev";

  return (
    <motion.div
      initial="hidden"
      animate="visible"
      variants={textContainerVariant}
      className="text-8xl lg:text-9xl"
    >
      {headingLine.split("").map((char, index) => {
        return (
          <motion.span
            key={char + "-" + index}
            variants={textVariant}
            initial="hidden"
            animate="visible"
            className="inline-block"
            custom={index}
          >
            {char}
          </motion.span>
        );
      })}
    </motion.div>
  );
};

export { MainHeading };

Video of how its happening
而我想要的文字显示与交错效果的动画，我不能理解这是什么错了