-1

1). "Link". I can't interact with the link/images on the backface of "follow us!" flip card on the bottom. (iv'e only used webkit). HELP :'(

2). Also when you move your cursor slowly towards the flip card, the card vibrates if your cursor's position isn't fixed. Unlike here: http://css3.bradshawenterprises.com/flip/

Trust me iv'e tried everything, and i'm just sick of this.

4

1 に答える 1

3

両側を表示するには、でCSSプロパティと値-webkit-transform-style: preserve3dを使用する必要がありますdiv#flipthing

2つの面が正確に重なっていないため、カードが振動しています。カードが反転しているとき、カーソルは余白、または振動を引き起こす後ろの要素、またはアニメーションのリセットに入ります。

<p>2つのタグをまったく同じに設定し、互いに積み重ねてみてください。

div#flipthing { position: relative; }

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

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

これにより、最初の段落を2番目の段落の上に積み重ねることができます。

さらに、背面については、ネストされたテーブルの代わりに段落に-webkit-transformとを配置する必要があります。-webkit-backface-visibility

于 2012-11-10T18:00:30.103 に答える