图片/图形
鼠标滑过图片3D透视jQuery特效插件
PetitQ
jQuery-Animate3d 是一款炫酷的鼠标滑过图片 3D 透视特效 jQuery 插件。通过该 jQuery 插件，你可以在鼠标滑过图片或其它元素时，为它添加 3D 透视效果。
使用方法
使用该 3d 透视插件，需要在页面中引入 jquery 和 3d.js 文件。
也想出现在这里？联系我们吧
<script src="path/to/jquery.min.js"></script>
<script src="path/to/3d.js"></script>
HTML 结构
你可以使用一个<div>元素作为容器，它里面的每一个元素都是一个图层。当鼠标滑过容器的时候，插件会为各个图层制作不同的 3D 透视效果。
<div class="image-container animate-1">
<img src="./img/world-map.png" alt="">
<img src="./img/layer.svg" alt="">
<img src="./img/layer.svg" alt="">
</div>
初始化插件
在页面 DOM 元素加载完毕之后，可以通过 animate3d()方法来初始化该 jQuery 插件。
$('element').animate3d();
配置参数
该 3D 透视特效插件的可用配置参数有：
Perspective：设置透视度。值必须大于 0，默认值为 1000
Distance：各层之间的感知距离。值必须大于 0，默认值为 50
Rotation：控制元素在鼠标滑过时的倾斜度。值在 0-1 之间，默认值为 0.5
StartX：设置默认情况下元素沿 X 轴的倾斜度。值在-1 到 1 之间，默认值为 0
StartY：设置默认情况下元素沿 Y 轴的倾斜度。值在-1 到 1 之间，默认值为 0
Github 地址：https://github.com/putnamn21/jQuery-Animate3d
| 演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
