c

可视化地建立网站动画和交互

Webflow的交互和动画工具将CSS和JavaScript的所有功能都变成了一个完全可视化的工具,使设计师能够构建复杂、丰富的动画,甚至不需要考虑代码。

暂停背景视频

轻松创建基于滚动的视差动画

链接你的动画和运动滚动进度,以实现视差、精确显示动画、进度条或任何你能想到的效果。

配合运动滚动进度

根据特定元素或整个页面上的滚动进度转换元素大小、样式和位置。

当你滚动的时候制作动画

将富有表现力的动画带到您的网站,随着用户移动页面。

围绕鼠标移动建立微交互

链接动画和移动到您的光标位置,以吸引访问者的注意力和工艺精确的微互动。

悬停触发可能不是在所有的触摸设备上都支持,许多设备会通过点击事件来激活悬停。

创建丰富的多步骤动画

创建丰富的、基于时间轴的动画就像设置PowerPoint或Keynote动画一样简单——但其结果是干净、有效的代码。

查看更多

点击显示内容

在点击时显示模式、面板和其他隐藏元素,使网站的交互性达到一个新的水平。

创建丰富的悬停动画

转换元素,更新样式,并显示悬停的新内容。

悬停触发可能不是在所有的触摸设备上都支持,许多设备会通过点击事件来激活悬停。

快速添加预设交互

需要添加一些简单的东西?从20多个预构建的交互和动画中选择,只需点击几下就可以将它们添加到您的站点。

入口效应
成长
幻灯片
褪色
自旋
强调的效果
果冻
反弹
橡胶
摇晃

After Effects & Lottie

整合After Effects和Lottie动画

使用Webflow的交互触发器控制After Effects和Lottie动画的播放-不需要一行接一行地写复杂的javascript。

了解更多珞蒂课程

元素和触发器

  • 悬停
  • 第一次和第二次点击
  • 鼠标移动
  • 滚动发展
  • 滚动进入和退出视图
  • 向上滚动和向下滚动
  • 页面开始装载
  • 页面加载完成后
  • 滑块面板改变
  • 选项卡面板改变
  • 下拉开放
  • 导航菜单打开

影响和控制

  • 移动
  • 规模
  • 旋转
  • 不透明度
  • 背景颜色
  • 边框颜色
  • 文本颜色
  • 宽/高
  • 显示/隐藏
  • 循环
  • 宽松
  • 持续时间/延迟
  • 每个断点的可见性
  • After Effects & Lottie
Baidu
map