2011-07-12 61 views
4

を変換して、このページを見てください助けが必要それを見た)と明らかに、私の2つの手の込んだdivは完全なボックスのように動作していません...はCSS3 3Dは

私はここで間違って何を考えて...?あなたが3D効果のために行くされているにもかかわらず、あなたが唯一のあなたの2D空間での要素を変換しているhttp://www.youtube.com/watch?v=pBgVbzBJqDc

+0

Lol ... C'mon guys ... 12ビューと回答なし?私は大好きと大いに感謝しますが、私はそれをより良くする方法についての提案はありませんか? – Abhishek

+0

@BoldClock - あなたの投稿にどのような編集を加えたのか教えてもらえますか? – Abhishek

+4

ここにいる皆さんが無料でお手伝いしています。あなたは忍耐が必要です。編集内容を確認するには、 "編集済み"の横にある時間をクリックして改訂履歴を確認してください(この場合は再タグ付けされました) –

答えて

4

これは、私は近くに取得したいものです。

実施例:
http://jsfiddle.net/mrlundis/wU296/

「底」スパンは、(それがその中心点の周りに回転だyz、要素の高さの半分に相当するtranslate3d(x,y,z)を使用して、「正面」スパンの背後に配置されています。 )-webkit-transform-originを使用して同じ効果を達成することが可能でなければなりません。

-webkit-transform-originは、含まれているdivがホバー上の中心点を中心に回転することを確認するためにも使用されます。

+0

あなたの例は素晴らしく、それは私が探していたすべてのものです...しかし、もう少し説明してください...「底」スパンは、想定キューブの底面として現れるように翻訳されています。基本的に '面'の位置でベーキングしてから、コンテナ要素(パースペクティブを設定したもの)を変換します。また、不平を言ってはいけませんが、このような変形を適用すると、要素がホバリングされたときにトランスフォームがトリガされないということです...これは技術的な制限ですか、それとも不足していますか実装に何か? – Abhishek

+0

ああ、-webkit-transform-originの15ピクセルは何ですか?唯一受け入れられる値はx&yだと思ったのですか? – Abhishek

+0

Ok、done ...私は多かれ少なかれ私が目指していたものを得ました...あなたの助けを借りて、あなたの助けを借りて、状況を理解しました。あなたはデモでそれに応じてクレジットされています... OPで提供されているリンクを参照してください:-) – Abhishek

関連する問題