Container Text Flip

A container that flips through words, animating the width.

通过 CLI 安装

npm

pnpm

bun

yarn

npx shadcn-vue@latest add "https://registry.inspira-ui.com/container-text-flip.json"

复制并粘贴以下代码：

ContainerTextFlip.vue

Standard

Hero section with animation

Prop 名称	类型	默认值	描述
`words`	`string[]`	`["better", "modern", "beautiful", "awesome"]`	Array of words to cycle through in the animation
`interval`	`number`	`3000`	Time in milliseconds between word transitions
`animationDuration`	`number`	`700`	Duration of the transition animation in milliseconds
`class`	`string`	``	Additional CSS classes to apply to the container
`textClass`	`string`	``	Additional CSS classes to apply to the text

本页