使用说明

1. 您可以通过拖动红色和橙色控制点来调整贝塞尔曲线
2. 也可以通过输入框精确设置控制点坐标
3. 点击"播放动画"按钮查看动画效果
4. 使用滑块调整动画持续时间
5. 点击预设按钮快速应用常用的贝塞尔曲线
6. 点击"复制"按钮将 cubic-bezier 函数复制到剪贴板

功能说明

这个页面实现了一个完整的 CSS3 cubic-bezier 函数在线调试工具，具有以下功能：

1. 贝塞尔曲线可视化 ：
   • 使用 bezier-js 库绘制贝塞尔曲线
   • 可拖动控制点调整曲线形状
   • 显示网格和坐标轴辅助线
2. 参数控制 ：
   • 通过输入框精确调整 P1(x1, y1) 和 P2(x2, y2) 坐标
   • 实时更新曲线和动画效果
3. 动画预览 ：
   • 显示基于当前贝塞尔曲线的动画效果
   • 可调整动画持续时间
   • 一键播放动画
4. 实用功能 ：
   • 复制 cubic-bezier 函数代码到剪贴板
   • 内置常用预设值（ease, ease-in, ease-out 等）
5. 响应式设计 ：
   • 适配不同屏幕尺寸