HTML5+CSS3实现鼠标悬停3D立体式图片效果 -懒人源码

HTML5+CSS3实现鼠标悬停3D立体式图片效果

作者/代码整理：懒人 (转载请附加本文地址，带有“懒人原生”字样的谢绝转载) 发布日期：2015-01-22

效果描述：

强大的css3功能，不得不再次膜拜

默认图片是作为背景图片平铺在div中，同时div保持一个默认的立体姿态

当鼠标悬停触发hover事件后，改变div的另一个状态

这样就实现了一个动画效果，实在是太棒了

想一想，这要是用js，得写多少代码才能实现

使用方法：

1、将head中的css样式引入到你的网页中

2、将body中的代码部分拷贝到你需要的地方即可

(图片采用绝对路径，不建议修改)

声明：凡标题注明“懒人原生”二字，均为本站原创，非书面授权谢绝转载