सफारी 6 ग्रेडियेंट रंग मिश्रण/इंटरपोलेशन बग

Question

तस्वीर को यह सब समझा जाना चाहिए। बाईं ओर सफारी 6 है और दाईं ओर इसके पीछे क्रोम है। न केवल पारदर्शी लाल ढाल का निचला आधा हिस्सा गलत है (जो शायद अति उत्साही प्रीमिलीप्लाइड अल्फा का मामला हो सकता है) शीर्ष आधा भी गहरा होता है जो गामा-शुद्धता की समस्या की तरह दिखता है।

यह समस्या माउंटेन शेर और आईओएस 6 मोबाइल सफारी पर सफारी 6 पर स्थित है, हालांकि शेर पर सफारी 6 पर नहीं।

http://jsfiddle.net/ZUTYm/4

किसी को भी अपेक्षित परिणाम प्राप्त करने के लिए एक समाधान पाया गया है? मुझे अल्फा को शामिल करने के लिए मेरे ग्रेडियेंट की ज़रूरत है क्योंकि मैं चीजों में और बाहर पाठ को फीका करने की कोशिश कर रहा हूं। background-image: -webkit-linear-gradient(top, red, rgba(255,128,128,0), white);

Answer 1

मैं मैक 10.8.1 सफारी 6.0 पर समस्या को पुन: करने में सक्षम था (8536.25:

के बाद से मैं अपने संपादित पूर्ण नहीं कर सकता जब तक मैं वास्तविक कोड यहाँ में डाल ढाल परिभाषा है) और आईओएस सफारी 6.0.1। मैं एक पारदर्शी रंग-स्टॉप के बजाय एक -webkit-mask-image टाल मुद्दे को लागू करने लगता है:

.grad-bg { 
    background-image: 
     -webkit-linear-gradient(top, #ff0000, #fff); 
    height: 100%; 
} 

.masked { 
    -webkit-mask-image: 
     -webkit-linear-gradient(top, white, transparent, white); 
} 

jsFiddle

छवि में, एक सफेद पृष्ठभूमि से अधिक शीर्ष शो, नीचे आकार की एक अपारदर्शी ढाल पृष्ठभूमि के ऊपर से पता चलता एक ही रंग

(कई संपादन।)