从中心成长

Question

我一直试图让底部圈子在Firefox中增长(需要添加其他前缀,仍然在开发中)

他们表现得很好,但我的目标是让他们从中心成长.关于我如何使用CSS来做到这一点的任何想法？它会是一个定位的东西吗？链接在这里:http://www.catonthecouch.com/feline/

我只是在悬停时增加宽度/高度.

Answer 1

如果您使用的是CSS3,则可以使用属性转换,并缩放元素.

Obs:我省略了前缀以避免过多的代码,但你应该使用它们.

.circle {
    width: 500px;
    height: 500px;
    border-radius: 100%;
    transform: scale(0.1); /* 1/10 of the original size */
    transition: all 1s ease-in-out;
}
.circle.opened {
    transform: scale(1);
}

工作演示:http://jsfiddle.net/JCMais/eKs59/

Answer 2

添加负左和上边距等于大小变化的一半(-15px)