以下是代码的问题。我想用css创建类似缩放的效果。我在某些事件上添加了带有jquery的类zoomIn或zoomOut,这在当前并不重要。
问题是在Chrome和Safari(基于webkit)中,放大和缩小从0开始。例如,在firefox中,转换从当前图像高度开始,在这种情况下扩展到1160px。然而,webkit浏览器似乎处理不同的事情并开始从0到1160px的过渡
我没有聪明的方法来解决这个问题所以请帮助
干杯
图像也有一类“完整”
.full {display:block;position:absolute;width:100%;top:0;left:0;}
.zoomIn{
top:0;left:0;
box-sizing: border-box;
-webkit-transition: all 0.2s ease-in;
-o-transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
height: 1160px !important;
left: 50%;
margin-left: -960px !important;
margin-top: -670px !important;
top: 50%;
width: 1920px;
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
-ms-transform: scale(1.2);
}
.zoomOut {
-webkit-transition: all 0.2s ease-in;
-o-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
-moz-transform: scale(1);
margin-left: 0 ;margin-top: 0;
-webkit-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
-ms-transform: scale(1);
}