jquery - 在 -webkit-transform:scale() 之后定位项目

Question

我正在尝试使用 jQuery 自动化 css 设置，我有类似的功能

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

页脚设置为底部= 0（使用foot_css），但是当我缩放页脚时，它不会停留在底部= 0，一些文本位于屏幕下方，因此不可读。编辑：这也发生在左边，“.footer”类的左下角不在屏幕上。

那么如何将页脚“停靠”到底部？也许是一种更好的扩展方式（比 webkit 和 moz）？

score 0 · Accepted Answer

当你使用transform:scale时，默认情况下它会在你重新缩放的元素中间重新缩放。如果您想定义转换的来源，只需在您的 css 中添加：transform-origin: horizontal vertical; 例如

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

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

1 回答 1