我正在使用 quickFlip,它非常棒,但我不知道如何让整个 div 翻转。用于翻转 div 的类在附加到实际 div 时不起作用,所以我尝试了 div 内的 ap 元素,高度和宽度设置为 100%,并将翻转类添加到其中,但现在我不能在里面嵌套标题。
关于如何使用 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>
这使得整个图块可以翻转,但现在我不能有任何标题,我认为有很多东西不能嵌套在 ap 元素中,所以我也不能使用它们。
有什么解决办法吗?我想知道为什么class="quickFlipCta"在 div 上不起作用。如果是这样,那就更神奇了。