Javascript 悬停时具有边框半径和不透明度的图像

我正在开发jquery插件。我需要在图像上制作遮罩效果。在FF上一切都很好，但在Chrome和Opera上却不起作用

这里是html结构

<div id="container">
    <img src="http://lorempixel.com/300/200" />
</div>

他是我的朋友

Chrome在悬停前看起来不错，但Opera的效果非常差。 不管怎样，在不改变html结构的情况下实现掩码效果是可行的吗

更新：我需要裁剪图像

提前感谢。

看起来效果不错：我必须为图像添加高度和宽度：

#container img {
    width: 100%;
    height: 100%;
}

---

似乎与opera 12.02一起工作如下：问题是它不尊重图像比率，这是真的。它依赖于容器的尺寸。无论如何，它可以设置必要的宽度和高度，而不是100%。基本上我也不明白，如果容器有溢出，为什么chrome不在悬停状态下裁剪图像：隐藏。。。也许是虫子。

#container img {
    width: 100%;
    height: 100%;
}