css - 为什么我不能与背面的链接互动？

Question

1). “Link”。我无法与“关注我们!”背面的链接/图片互动。在底部翻转卡片。 (我只用过 webkit)。帮助:'(

2).此外，当您将光标慢慢移向翻转卡片时，如果您的光标位置不固定，卡片会振动。不像这里:http://css3.bradshawenterprises.com/flip/

相信我，我什么都试过了，我就是受够了。

Answer 1

要查看双方，您需要使用 CSS property and value, -webkit-transform-style: preserve3d 在你的 div#flipthing .

你的卡片在振动，因为两个面没有完全对齐。卡片翻转时，光标进入页边距，或后面的元素引起震动，或动画重置。

尝试设置您的两个 <p>标签完全相同，彼此堆叠:

div#flipthing { position: relative; }

div#flipthing p {
    position: absolute;
    top: 0;
    left: 0;
}

div#flipthing p:first-child {
    z-index: 10;
}

这将使您的第一段堆叠在第二段之上。

另外，对于你的背面，你应该把-webkit-transform和 -webkit-backface-visibility在段落而不是嵌套表格上。