Jquery 如何使整个div可翻转？

我用的是quickFlip，这是一种超级兴奋剂，但我不知道如何让整个div翻转。用于翻转div的类在附加到实际div时不起作用，因此我尝试在div中使用高度和宽度设置为100%的p元素，并将翻转类添加到该div中，但现在我无法在其中嵌套标题

关于如何使用jQuery使div可翻转有什么想法吗

我当前的瓷砖html如下所示：

<div id="tile-wrap">
           <div class="size4 red fL i-projects"> 
        <h1>Project Portfolio</h1>
    </div>
            <div class="size4 orange fR i-interests">
        <h1>Career Interests</h1>
    </div>
    <div class="size4 purple fL i-resume">
        <h1>Resume</h1>
    </div>
    <div class="size4 green fR">
    </div>
    <div class="size4 x-l blue fL i-person">
        <h1>About Me</h1>
    </div>
     <div class="size4 yellow fR i-school">
        <h1>Education</h1>
    </div>
    <div id="contact" class="size2 black fL i-email">
        <h1 style="text-align:left">Contact</h1>
    </div>
  </div>

项目组合
职业兴趣
简历
关于我
教育类
接触

我用quickFlip尝试的是这个，但我无法在其中获得任何标题或其他内容

 <div id="tile-wrap">
    <div class="quickFlip">
         <div class="size4 red i-interests"> 
        <p class="quickFlipCta" style="height:100%;width:100%">
                <!-- this is not shown -->
                <h1>Project Portfolio</h1>
             </p>
         </div>
         <div class="size4 red">
          <p class="quickFlipCta" style="height:100%;width:100%"> 
              <h1>Provide Info Here</h1>
              <!-- this is not shown and niether is the heading above -->
              This might contain a list or something.
          </div>
    </div>
     </div>

这使得整个平铺可以翻转，但是现在我没有任何标题，我假设有很多东西你不能嵌套在p元素中，所以我也不能使用它们

---

有解决办法吗？我想知道为什么class=“quickFlipCta”在div上不起作用。如果它真的这样做了，那将更加令人惊奇。

你应该尝试通过CSS3动画和3d变换来完成翻转。这比jQuery更平滑，并且不需要那么多的资源

请查看以下页面：