Jquery 模态img尺寸的CSS转换

我有简单的响应模式。一个问题。我不明白我应该在哪里设置图像的转换，以便在prev next按钮上触发它。当按钮被触发时，我希望模式窗口随过渡调整大小。当我在.modal内容img上使用transition时，它不起作用 图像代码

.modal-content img {
display:block;
position:relative;
width:100%;
max-width:100%;
height:auto;
transition:width 500ms linear, height 500ms linear;
}



.button-click {
    width:auto;
    height:auto;
   }

按钮代码

$('.btnModal-right').click(function(){
    clicked.next().find('img').addClass('button-click').trigger('click');
});

$('.btnModal-left').click(function(){
    clicked.prev().find('img').addClass('button-click').trigger('click');
}); 

你能给我指一下正确的方向吗？

---

谢谢大家!

我知道你没有任何转换的CSS。这就是为什么我问我应该在哪里设置过渡？我尝试在.modal content img上设置width和height transition，然后创建另一个width:100%和height:auto的类，以便在addClass metod中使用，但它对我不起作用。