1

我目前正在尝试在 LESS CSS 中为我​​的渐变创建单点定义。我创建了一个为我编写跨浏览器 CSS 代码的函数，但有一个问题我无法解决。

我想指定一次渐变并有一个单独的函数（监听参数“flip”）在悬停时交换两个颜色变量。我在下面发布了一个示例：

    selector { .background-gradient(rgba(27, 117, 185, .35), 48%, rgba(22, 97, 154, .35), 52%); }
    selector:hover { .background-gradient(flip); }

我一直在寻找解决方案，但当然，一无所获。总结一下：我想要一个函数来读取选择器的渐变值并使用它们通过交换颜色来创建悬停样式。我希望这是可能的。

提前致谢！

PS：创建监听“翻转”（模式匹配）的功能不是问题，但我认为它可以让您更好地了解我实际想要实现的目标。

4

1 回答 1

1

它不是 100% 清楚你想要什么，但为什么不拥有这样的东西

.selector {
  @startCol: rgba(27, 117, 185, .35);
  @startPercentage: 48%;
  @endCol: rgba(22, 97, 154, .35)
  @endPercentage: 52%;
  .gradient(@startCol, @startPercentage, @endCol, @endPercentage);
  &:hover {
    .gradient(@endCol, @endPercentage, @startCol, @startPercentage);
  }
}

如果在悬停时翻转很常见，您可以将上面的内容设置为 mixin，然后您只需为每个类/渐变定义调用一次。

mixin 无法知道先前传递给函数的参数或调用带有值数组的 mixin。

于 2012-07-05T04:55:04.980 回答