广泛的悬停效果库
这是元素的核心。超越简单的颜色变化。从精心策划的复杂效果列表中选择触发悬停的效果。想要经典的底线幻灯片?有趣的三点揭示?戏剧性的3D幻灯片或文本填充效果?每个效果都对链接文本及其伪元素应用独特的CSS动画,创建从优雅到大胆的交互。该库可让您在菜单、目录或功能列表中添加个性并打磨,而无需编写单行代码。
- 22+ 预构建效果:立即应用 Border Switch、Scale Down、Circle、Cross 和 Move Up 等动画。
- 风格范围:从微妙(底部边框放大)到粗体(3D 效果、第二文本和边框显示推出)。
- Easy 应用:从下拉选择效果—无需复杂的配置即可开始使用。
适合所有链接状态的造型
通过对链接效果的每个组件进行造型来实现像素完美的设计 设置基本版式、链接填充和整体宽度 然后,深入状态造型 为普通和悬停定义文本颜色和背景颜色 至关重要的是,对效果中使用的彩色元素进行造型:跨度 BG 颜色、BG 颜色之前和 BG 颜色之后 这些控制动画伪元素的背景,这些元素为滑行线、填充背景或扩展圆圈等效果提供动力 添加边框半径和框影以完成外观。
- 双态设计:独立控制普通态和悬停态的颜色和背景。
- 效果组件造型:直接为创建动画视觉效果的 Before、After 和 Span 背景设计风格。
- 完整版式控制:选择链接文本的字体、大小、重量和间距。
- 形状和深度:使用边框半径和框影来软化或升高链接的容器。
创意链接的常见问题
"链接文本"和"替代链接文本"有什么区别?
Link Text 是默认情况下始终可见的内容(例如,“我们的服务”),替代链接文本是在悬停效果期间出现或交互的内容,在 “文本填充” 或 “边界切换 等效果中,” 此替代文本可能会与原始文本一起滑入、替换或动画化,从而产生动态变化。
我可以使用这些创意链接作为我网站的主要导航吗?
Absolutely!它们非常适合头菜单,特别是对于极简主义或创意的网站设计,您希望导航本身成为视觉功能,只需将每个菜单项作为单独的“Item”添加到内容中继器中即可。
"BG颜色之前"和"BG颜色之后"是干什么的?
这些是秘密成分。大多数高级 CSS 悬停效果使用::之前和::之后伪元素来创建动画形状、线条或背景填充。这些颜色控件可让您直接为那些隐藏元素设计样式,使您可以将效果的颜色与您的品牌相匹配。例如,在底线幻灯片效果中,After BG Color 可能会控制幻灯片下划线的颜色。
动(触摸屏)设备上的效果是否有效?
是的,它们功能齐全。在触摸设备上,悬停效果通常在第一次点击时触发(“悬停量”状态),并在第二次点击时跟踪链接。这是移动设备上悬停效果的标准行为。您可以在页面更改之前获得动画反馈。
如何选择正确的效果?
考虑您网站的个性:
- 专业/企业:使用底线幻灯片或边框翻译等微妙效果。
- 创意/作品集:转到 3D 幻灯片、圆圈或文本填充等更大胆的效果。
- 现代/极简主义:底部边框放大或缩小工作效果优美。
预览几个,最好的效果可以增强链接,而不会感到分心。
我可以对同一小部件中的不同链接应用不同的效果吗?
截图显示一个全局效果下拉,建议一个小部件实例中的所有链接共享相同的选定效果。要具有不同的效果(例如,一个链接具有圆圈效果,另一个链接具有幻灯片效果),您可能需要放置多个单独的创意链接小部件。
