Question

我想知道我是否在2个属性上使用了转换 - translateY和scale并且只想在悬停时转换比例我是否仍然必须在我的悬停转换中包含translateY属性以防止它被取消或者有什么我可以做到这一点吗？而不是过渡变换我可以只转换规模？我正在使用罗盘。如果有人可以推荐我如何增强这个代码，那就太好了。

示例：

.btn {
    width: 100px;
    height: 20px;
    background: grey;
    display: block;
    @include transform( translateY(-50%) scale(1) );
    @include transition( transform .3s ease-in-out ); // i don't want to transition all transform properties but instead just the scale???

    &:hover {
        @include transform(translateY(-50%) scale(1.1)); //do i really need to have translateY in here even when it doesn't change on hover???
    }
}

Codepen http://codepen.io/anon/pen/BiGHl

Answer 1

据我所知，您需要保留translateY(-50%)条目。

由于翻译和缩放都在transform:样式内，因此不在悬停状态下输入translateY值，实际上是告诉translatey(0%)过渡动画。

替代方案是通过关键帧为其设置动画。

如何在不取消选择器中的其他变换的情况下变换1个属性？

1 个答案: