我正在制作画廊。单击图像时,它应该放大到 View 中心。现在点击事件会给图像这个类:
.imgFocus
{
transition : All 1s ease;
transform : scale(2);
}
这看起来很好,图像放大了。但我希望它放大到容器的中心,无论图像从哪里开始。
像这样(模型):
.imgFocus
{
transition: All 1s ease;
transform: translate( 'containerCenter' ) scale(2);
}
有什么好的方法吗?
最佳答案
一些解决方案
添加 transform-origin:50% 50%;-moz-transform-origin:50% 50%;-ms-transform-origin:50% 50%;-webkit-transform-origin:50% 50 %;到 img
添加 background-image + background-position:50% 50% + background-size 200% 200% + relative to the container & 移除 img
关于javascript - CSS3 缩放图像到容器中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19560927/