CSS3图像在转换时悬停在圆形div之外

Question

为什么图像在悬停之外的overflow:hidden div之外，如何修复此错误？

ex：http://jsfiddle.net/b5EyS/

注意：chrome的问题

Answer 1

通过向img添加border-radius解决了这个问题。不确定你想要的是不是。如果有这个问题请评论！

a {
    width: 100px;
    height: 100px;
    background: #000;
    display: block;
    border: 2px solid #000;
    border-radius: 50%;
    overflow: hidden;
}
img {
    max-width: 100%;
   -webkit-transition: opacity 0.1s linear;
    -moz-transition: opacity 0.1s linear;
    -o-transition: opacity 0.1s linear;
    transition: opacity 0.1s linear;
    border-radius: 50%;
}
img:hover {
    opacity: 0.5;
}