快速制作卡片翻转效果的jquery插件

这是一款可以快速制作卡片翻转效果的jquery插件。用户可以不了解CSS3语法，就可以通过该插件制作出炫酷的卡片翻转效果。

安装

可以通过npm或bower来安装jquery.flip.js卡片翻转插件。

npm install nnattawat/flip
bower install flip                  
                

使用方法

在页面中引入jquery和jquery.flip.js文件。

<script src="path/to/jquery.js"></script>
<script src="path/tojquery.flip.js"></script>
                

HTML结构

一张要进行3D翻转的卡片的基本HTML结构如下：

<div id="card"> 
  <div class="front"> 
    卡片正面内容
  </div> 
  <div class="back">
    卡片反面内容
  </div> 
</div>
                

初始化插件

在页面DOM元素加载完毕之后，可以通过flip()方法来对插件进行初始化。

$(function($) {
  $("#card").flip(); 
});                 
                

配置参数

jquery.flip.js卡片翻转插件的可用配置参数如下：

关于jquery.flip.js卡片翻转插件的更多信息可以参考：https://github.com/nnattawat/flip