在-webkit-transform:scale()之后定位元素

Question

我尝试使用jQuery自动化CSS设置，我有以下函数：

$(".footer").css(foot_css)//pre-defined css object
//AND
$(".footer").hover(function(){
$(this).css("-webkit-transform", "scale(2)"); 
});

设置为bottom=0（使用foot_css），但是当我调整页脚大小时，它不会保持在bottom=0位置，因此某些文本在屏幕下方，无法阅读。 编辑：对于左侧也是如此，".footer"类的左下角超出了屏幕。

那么我该如何将页脚“停靠”在底部？也许有更好的缩放方式（而不是使用webkit和moz）吗？

- void

Answer 1

当您使用transform:scale时，默认情况下会在重新缩放的元素中间进行重新缩放。如果您想定义变换的起点，只需在您的CSS中添加：transform-origin: horizontal vertical; 例如：

.myScaledObj{
   -webkit-transform: scale(0.5);
   -webkit-transform-origin: 50% 0%; 
}

这将重新缩放您的对象，使变换的原点位于其顶部中心位置

- leMoisela