css - css3 で画像を拡大する (wabkit ベースの問題)

Question

これが以下のコードの問題です。cssでズームのような効果を作りたいです。特定のイベントで jquery を使用してクラス zoomIn または zoomOut を追加していますが、これは現時点では重要ではありません。

問題は、Chrome と Safari (Webkit ベース) ではズームインとズームアウトが 0 から始まることです。ただし、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);

  }