jQuery चेतन सीएसएस बॉर्डर-त्रिज्या संपत्ति (वेबकिट, मोज़िला)

Question

वहाँ jQuery में एक तरह से css3 बॉर्डर-त्रिज्या संपत्ति वेबकिट और मोज़िला ब्राउज़र में उपलब्ध चेतन करने के लिए है?

मुझे ऐसा प्लगइन नहीं मिला है जो इसे करेगा।

-webkit-border-radius 

-moz-border-radius 

Answer 1

मैं मूल रूप से उम्मीद है कि कुछ की तरह ...

$("selector") 
    .css({borderRadius: 10}); 
    .animate({borderRadius: 30}, 900); 

... काम करेगा। लेकिन, मैं गलत था: वेबकिट आपको borderRadius के माध्यम से सभी चार कोनों के लिए मान देता है, लेकिन आपको इसे वापस पढ़ने की अनुमति नहीं देगा - इसलिए ऊपर दिए गए कोड के साथ, एनीमेशन हमेशा 10 के बजाय 0 पर शुरू होगा। एक ही समस्या है। फ़ायरफ़ॉक्स आपको इसे वापस पढ़ने देता है, इसलिए सबकुछ वहां अपेक्षित काम करता है।

खैर ... सीमा-त्रिज्या में कार्यान्वयन मतभेदों का इतिहास है।

सौभाग्य से, एक काम के आसपास है:

$("selector") 
    .css({ 
    borderTopLeftRadius: 10, 
    borderTopRightRadius: 10, 
    borderBottomLeftRadius: 10, 
    borderBottomRightRadius: 10 }) 
    .animate({ 
    borderTopLeftRadius: 30, 
    borderTopRightRadius: 30, 
    borderBottomLeftRadius: 30, 
    borderBottomRightRadius: 30}, 900); 

नोट अगर आप पुराने ब्राउज़र के साथ संगतता बनाए रखने के लिए चाहते हैं, आप सभी से बाहर जाने के लिए और वर्ष ब्राउज़र- उपयोग कर सकते हैं कि: बस प्रत्येक कोने त्रिज्या को व्यक्तिगत रूप से निर्दिष्ट उपसर्ग नाम:

$("selector") 
    .css({ 
    borderTopLeftRadius: 10, 
    borderTopRightRadius: 10, 
    borderBottomLeftRadius: 10, 
    borderBottomRightRadius: 10, 
    WebkitBorderTopLeftRadius: 10, 
    WebkitBorderTopRightRadius: 10, 
    WebkitBorderBottomLeftRadius: 10, 
    WebkitBorderBottomRightRadius: 10, 
    MozBorderRadius: 10 
    }) 
    .animate({ 
    borderTopLeftRadius: 30, 
    borderTopRightRadius: 30, 
    borderBottomLeftRadius: 30, 
    borderBottomRightRadius: 30, 
    WebkitBorderTopLeftRadius: 30, 
    WebkitBorderTopRightRadius: 30, 
    WebkitBorderBottomLeftRadius: 30, 
    WebkitBorderBottomRightRadius: 30, 
    MozBorderRadius: 30 
    }, 900); 

हालांकि यह बहुत पागल हो जाता है; यदि संभव हो तो मैं इससे बचूंगा।

Answer 2

cssHooks का उपयोग करें। cssHooks को

http://www.webmuse.co.uk/articles/border_radius_csshook_with_internet_explorer_support/

लिंक::

इससे आपको यह पता करने में मदद करेगा

https://github.com/brandonaaron/jquery-cssHooks

गुड लक!

Answer 3

जस्ट एक सलाह है, हम एक समारोह ब्राउज़र की सीएसएस उपसर्ग यहाँ एक नमूना कोड .. http://jsfiddle.net/molokoloco/f6Z3D/