jQuery超酷3D包装盒封面旋转特效

时间：2016-03-09
　　简要教程
　　3DCoverjQuery是一款效果非常炫酷的3D包装盒封面旋转jQuery特效插件。通过这个插件，你可以很轻易的将图片制作为DVD，XBOX，游戏和书本的封面，并且可以旋转封面来查看它的正面和反面。

1.jpg
查看演示      下载插件

　　使用方法
　　在页面中引入jQuery和bootstrap.min.css以及Cover3D.css和Cover3D.js文件。
  1. <!-- Bootstrap and JQuery -->
  2. <link rel="stylesheet" href="bootstrap.min.css">
  3. <script src="jquery-2.1.4.min.js"> </script>
  4.      
  5. <!-- Plugin -->
  6. <link rel="stylesheet" href="Cover3D.css">
  7. <script src="Cover3D.js"></script>
复制代码
2.jpg

　　HTML结构
　　该封面特效的HTML结构使用一个<div>来包裹一张图片。
  1. <div id="cover3">
  2.   <img src="img/avengers-dvd-cover-1.jpg"/>
  3. </div>   
复制代码

　　初始化插件
　　在页面DOM元素加载完毕之后，可以通过CoverTresD()方法来初始化该封面特效插件。
  1. $('#cover3').CoverTresD();      
复制代码

　　配置参数
　　该封面特效只有一个可配置的参数color。它是封面的边框颜色。
  1. { color:"#FF0" /*Border Color *
上一篇：SVG基础 | SVG和CSS级联样式表 下一篇：SVG进阶 | SVG渐变(SVG GRADIENTS)

相关文章

最新文章

Copyright © 2022-2023 HTML5模板网 版权所有并保留所有权