如何使用javascript为不可动画的属性设置动画

Question

我需要为图像制作一个smoothzoom。这是我的代码。但是，我无法为它制作动画。

<img src="images/2.jpg" class="sz" onclick="zoomIn()" id="sz">

    function zoomIn() {
  document.getElementById('dark').setAttribute('style', 'display:block;')
  document.getElementById('sz').setAttribute('style', 'z-index: 1; position:absolute; left:0; right:0;top:0; bottom:0; margin:auto;max-width:100%;max-height:100%;overflow:auto;');
}
    img.sz {
  transition: all .5s ease-out;
  -webkit-transition: all .5s ease-out;
}