单击按钮时 CSS 转换不起作用

Question

我想要一个按钮来触发弹出窗口。单击按钮时会显示弹出窗口，但它确实突然发生，所以我想添加一个过渡，但它似乎不起作用。

HTML:

<button class="terug"></button>

CSS:

img.popup{
    width: 15em;
    position: absolute;
    top: 25em;
    left: 4em;
    transition: ease-in 1s;
  }

JS:

var uno =       document.querySelector('button.terug');

var popup = document.querySelector('img.popup');

uno.addEventListener ('click', function(){
    popup.classList.toggle('popup');
});

Answer 1

也许:

    var popup = document.querySelector('img');

代替:

    var popup = document.querySelector('img.popup');