静态部分的读数就像平面图像,给它一个温和、循环的漂移,同样的元素感觉充满活力。 浮动效果扩展 在 硕士插件专业版 elementor小部件中添加了连续运动,没有关键帧或自定义css可以编写,本指南解释了扩展的作用,您可以动画化什么以及如何应用它。
什么是浮动效应扩展? #
的 漂浮效果 extension 是一个 Master Addons Pro 运动工具,它为 Elementor 小部件添加了一个连续的循环动画。它将小部件移动到 from 和 To 值之间 翻译, 旋转 並 规模 变换,然后再次变换,每个变换都有 持续时间 並 延迟 fields。com 运行在小型动漫。js库上的动作, 滑顺的入门轻松。截面、列和容器没有得到面板。
你可以动画什么 #
Floating Effects 通过三种变换类型进行工作, 您将它们与定时控制相结合来塑造运动:
- 翻译: 翻译 X 和翻译 Y,每个值的从 到 到 值在 -100 到 100 px 之间,适用于经典的上下或左右浮动。
- 旋转: X、Y 和 Z 在 -180 到 180 度之间旋转,来回转动小部件以获得摇摆。
- 比例: X和尺度Y在0到5之间,生长和缩小小部件以获得软脉冲。
- 持续时间和延迟: Duration 最高可达 10000 毫秒(空时为 1000 毫秒),Delay 最高可达 5000 毫秒。当您打开多个变换时,它们共享一个时间线,首先使用翻译的时序,然后使用旋转的时序,然后使用缩放的时序。
如何在元素器中添加浮动效果 #
Elementor 编辑器中的每个小部件应用浮动效果,一旦在主插件中启用扩展,简而言之:选择要动画化的元素,打开其设置,打开浮动效果,并选择具有其时序的变换。
- 确保 硕士插件专业版 已安装并处于活动状态,并且在主插件面板中启用了"浮动效果"扩展。
- Elementor 编辑器中, 选择要动画化的小部件。
- 打开元素的设置并找到主插件 漂浮效果 控制,然后打开效果。
- 打开 翻译, 旋转 或 规模设置 From 和 To 值,然后设置 持续时间 並 延迟.
- 预览或发布页面以查看实时网站上的元素漂移。
使用浮动效果的技巧 #
- 保持动作微妙。 翻译距离小,持续时间慢,读作抛光;大而快速的动作看起来分散注意力。
- 每个视图使用一两个元素。 单个漂浮的英雄图像或图标吸引了人们的目光;整页的运动与自身竞争。
- 将其与入口运动配对。 将浮动效果与 入口动画 扩展,使元素首先放松,然后保持平缓的漂浮。
- 在手机上查看。 确认该机芯在较小的屏幕上仍然看起来不错,并且不会将附近的内容推到周围。
常见问题 #
Master Addons 中的 Floating Effects 扩展是什么?
Floating Effects 是一个 Master Addons Pro 扩展,为 Elementor 小部件添加了连续、循环的动画。它通过平移、旋转和缩放变换在 From 和 To 值之间来回移动小部件,具有持续时间和延迟设置,并且没有自定义 CSS 或关键帧。
Floating Effects 可以制作什么样的动画?
持平移来上下或左右移动一个元素,旋转来回轻柔的摇摆,缩放来达到柔和的脉动效果三种变换类型,可以将变换与时序设置结合起来,塑造出你想要的精确运动。
我可以控制浮动动画的速度和方向吗?
Speed,是的,每个变换都有 Duration 和 Delay 字段,但组合变换共享一条时间线,使用先平移,然后旋转,然后缩放,没有方向设置:运动总是从 From 值播放到 To 值并返回。
浮动效应适用于任何元素元素吗?
Widgets 上才工作,比如图像、图标、标题或按钮,截面、列和容器没有得到浮动效果面板,所以要浮动一组元素,就把效果添加到每个 widget 上。
浮动动画会减慢我的网站速度吗?
动作贯穿小型动漫。js库,只对浏览器处理得很好的CSS变换进行动画处理。为了保持页面流畅,只需在每个视图的一两个元素上使用它,并保持动作微妙,而不是同时对页面上的所有内容进行动画处理。
浮动效应免费吗?
号浮动效果是大师Addons Pro的一部分,自由元素器有入口动画播放一次,但没有循环浮动。
