当光标悬停在图像上时，我将此 css 转换应用于表格中的图像..
transform-origin: bottom right;
-webkit-transform: scale(5) ;
我已经尝试了各种方法来获取图像之外的原点，但似乎没有办法。如果原点在“右”，则图像会向左扩展以遮盖原始图像。
我想将变换图像完全放在 table 外的固定位置!或者至少公开小图像。
最佳答案
* {
margin: 0;
padding: 0;
}
img {
width: 100%;
-webkit-transition: all 0.7s ease;
-o-transition: all 0.7s ease;
transition: all 0.7s ease;
}
img:hover {
-webkit-transform: translate3d(25px, 25px, 100px);
transform: translate3d(25px, 25px, 100px);
-webkit-transition: all 0.7s ease;
-o-transition: all 0.7s ease;
transition: all 0.7s ease;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div class="wrapper">
<img src="https://media.sproutsocial.com/uploads/2017/02/10x-featured-social-media-image-size.png" alt="">
</div>
</body>
</html>不要使用 transform-origin: bottom right; 使用 transform: translate3d(25px, 25px, 100px); 属性。希望对你有帮助
关于css - 使用 css 变换和缩放在悬停时定位图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57020361/