किसी भी

Question

पर एक CSS3 संक्रमण सेट करें मैं इसे कैसे बनाऊंगा ताकि एक सीएसएस संक्रमण मीडिया-क्वेरी के अंदर काम न करे, या किसी अन्य मामले में? उदाहरण के लिए:

@media (min-width: 200px) { 
    element { 
     transition: width 1s; 
    } 
} 

@media (min-width: 600px) { 
    element { 
     transition: none; // SET TO NO TRANSITION 
    } 
} 

Answer 1

आप संक्रमण-संपत्ति से कोई भी सेट कर सकते हैं। इस तरह, कोई संक्रमण प्रभाव लागू नहीं किया जाएगा।

इस तरह

:

-webkit-transition-property: none; 
-moz-transition-property: none; 
-o-transition-property: none; 
transition-property: none; 

Answer 2

transition: width 0s 

चाल करना चाहिए - के रूप में यह मूल रूप से कह रहा है कि वहाँ एक संक्रमण है, लेकिन 0s भी यह देखने के लिए त्वरित है!

Answer 3

संक्रमण-संपत्ति की स्थापनाकिसी से0s को संक्रमण अवधि स्थापित कर रही है की तुलना में और भी बेहतर।

-webkit-transition-duration: 0s; 
-moz-transition-duration: 0s; 
-o-transition-duration: 0s; 
transition-duration: 0s; 

क्यों बेहतर है:

इस पार ब्राउज़र कोड है? क्योंकि, डिफ़ॉल्ट रूप से, मानक-अनुरूप ब्राउज़र (जैसे फ़ायरफ़ॉक्स) संक्रमण-संपत्ति से प्रत्येक तत्व के लिए सभी सेट करते हैं। उन्होंने संक्रमण-अवधि से 0s भी सेट किया। इस प्रकार, संक्रमण-अवधि से 0s सेट करके, आप सबसे करीबी मिलान कर रहे हैं कि ब्राउजर संक्रमण के बिना तत्व को कैसे परिभाषित करता है।

डिफ़ॉल्ट 0s को संक्रमण अवधि स्थापना संक्रमण-संपत्ति अप्रासंगिक बना देता है।