2011-02-04 17 views
5

मैं दो <div> तत्वों है कि eachother ओवरलैप, जैसे:सीएसएस 3 डी रूपांतरण और zindex लड़

------------- 
|   | 
|  A  | 
|   | 
| ------------ 
| |   | 
| |   | 
----|  B | 
    |   | 
    ------------ 

तो मैं ए के अंदर div ऐ के बाद डोम को बी जोड़ने के कुछ अन्य HTML तत्वों (चित्र) है कि मैं css3d ट्रांसफॉर्म को लागू करें, हालांकि जब मैं ऐसा करता हूं तो वे div B के सामने भी दिखाई देते हैं, मैं हमेशा div बी को div A और उसके सभी सामग्री से ऊपर रखना चाहता हूं। मैंने दोनों div तत्वों पर जेड-इंडेक्स प्रॉपर्टी को सेट करने का प्रयास किया लेकिन ए में 3 डी ट्रांसफॉर्म किए गए आइटम अभी भी div B.

बी को हमेशा ए बनाने के लिए किसी भी तरीके से ए और इसकी सामग्री के सामने दिखाई देने का कोई तरीका है?

धन्यवाद मार्क।

+0

यह शायद कुछ करना पड़ता है खुद को बदलने के साथ करो। आप एक डीवी पर अपने जेड-इंडेक्स नियम के लिए महत्वपूर्ण सेटिंग स्थापित करने का प्रयास कर सकते हैं। बच्चे वारिस करेंगे। – Kyle

उत्तर

0

यह काम करता है: http://jsfiddle.net/qkLWH/1/

+0

ऐसा लगता है कि बी को ए के बच्चे के रूप में रखा जाता है (ओपी की डोम संरचना से अलग)। –

1

आप एक तत्व के z-index 3 डी तब्दील divs के खिलाफ काम करने की जरूरत है, तो आप codepen पर -webkit-transform: translateZ(0px);

स्निपेट के साथ यह शैली देने की आवश्यकता ->http://codepen.io/mrmoje/pen/yLIul