如何修复此鼠标悬停变换缩放效果（提供动画）

Question

我有一个带有图像的GridView，所以如果我将鼠标放在上面，它会正确显示图像，但是如果我放下它，它就不会出现。我认为问题是由CSS引起的叠加，但我不确定如何绕过它。

这是我的css代码：

.enlarge:hover {
    transform:scale(5);
    transform-origin:20% 20%;
}

标记：

<asp:ImageField ItemStyle-CssClass="enlarge" DataImageUrlField="FileName" ItemStyle-HorizontalAlign="Center" ItemStyle-VerticalAlign="Middle" ControlStyle-Height="20px" HeaderText="Swatch">
     <HeaderStyle HorizontalAlign="Center"/>
</asp:ImageField>

动画信用：http://www.screentogif.com（屏幕抓取到gif的绝佳工具 - 没有联属关系）

Answer 1

修复了需要添加img的CSS：

.enlarge:hover img {
    -webkit-transform: scale(15);
    -moz-transform: scale(15);
    -o-transform: scale(15);
    transform: scale(15);
    transform-origin: -15% 50%;
}