html – 使用纯CSS进行3d变换

我试图用纯css重建
this.而且我已经有
this了.但是你可以从flash版本中看到的想法是,当封面出现时,其他div会为悬停的那个腾出空间.

我试图在auto上设置宽度,并在该特定div上设置了转换属性,但没有运气.我还尝试在悬停之前将div的宽度设置为0,并在悬停时将其设置为300px,这样做但它并没有真正动画..

它可能是简单的,也可能不是,但无论哪种方式都可以很好地推动正确的方向!

谢谢.

最佳答案 您不需要WebGL浏览器就可以通过简单的3D变换来完成此操作.

您必须在悬停时显式更改div的宽度,因为显式转换不会触发重新布局.你需要绝对定位书的内容.

您应该使用包装器div来进行悬停宽度更改,并使用子div进行转换.

嵌套是改变理智的关键.

这是jsfiddle,它在行动中显示它:http://jsfiddle.net/ZMqze/4/

需要更多的润色才能取消.

点赞