javascript - 没有div或以某种方式放大图像

Question

我正在使用Joomla开发网站，并且希望放大文章上的图像。
这很容易做到：
的HTML

<div class="container"><img src="lol.png" /></div>

的CSS

.container {overflow: hidden; width: 200px height: 150px;}
.container img:hover {transform:scale(1.1);}

问题是图片在文章上不使用div，并且我不会让客户每次创建新文章时都将div放在img周围。
因此，如果您有任何想法或任何js代码将div放在图片周围，则将对您有所帮助

Answer 1

您可以使用clip-path做一些事情：

img:hover {
    tranform: scale(1.2);
    clip-path: polygon(5% 5%, 95% 5%, 95% 95%, 5% 95%);
}

Live demo。