IE6 मुद्दों

Question

मैं विचार करने के लिए इस्तेमाल प्राप्त हुए हैं कि अगर मैं चाहता हूँ/एक क्रॉस-ब्राउज़र ढंग से अल्फा ट्रांस PNG का उपयोग करने की आवश्यकता है कि मैं एक div पर एक पृष्ठभूमि छवि का उपयोग और उसके बाद, IE6- में केवल सीएसएस, पृष्ठभूमि को "none" के रूप में चिह्नित करें और उचित "फ़िल्टर" तर्क शामिल करें।

क्या कोई और तरीका है? एक बेहतर तरीका? क्या आईएमजी टैग के साथ ऐसा करने का कोई तरीका है और पृष्ठभूमि छवियों के साथ नहीं?

Answer 1

लब्बोलुआब यह है, अगर आप एक PNG में अल्फा पारदर्शिता चाहते हैं, और आप इसे IE6 में काम करने के लिए है, तो आप AlphaImageLoader फ़िल्टर लागू करने की जरूरत है चाहता हूँ।

अब, वहाँ यह करने के लिए कई तरीके हैं: ब्राउज़र विशिष्ट हैक्स, सशर्त टिप्पणियाँ, जावास्क्रिप्ट/JQuery/JLibraryOfChoice तत्व यात्रा, सर्वर-साइड सीएसएस सेवारत UserAgent-सूँघने के माध्यम से ...

लेकिन के सभी ' फ़िल्टर लागू होने के लिए नीचे आ गया और पृष्ठभूमि हटा दी गई।

Answer 2

तत्वों img के लिए सामान्य समाधान एक 1x1 पिक्सेल पारदर्शी GIF को इंगित करने के स्रोत को बदलने और उसके बाद ही फिल्टर हैक उपयोग करने के लिए है।

Answer 3

यह सबसे अधिक संभावना है "सर्वश्रेष्ठ" तरीका। लेकिन ध्यान रखें कि यह केवल अल्फा-ट्रांस नहीं है कि पीएनजी फ़ाइलों की बात करते समय IE6 ठीक से लागू नहीं होता है; आईई के कारण कलर स्पेस भ्रष्ट है, जिससे गामा को सही तरीके से कार्यान्वित नहीं किया जा रहा है, और इस प्रकार पीएनजी फाइलें अक्सर उन्हें "गहरा" दिखाना चाहिए।
एक वैकल्पिक "समाधान" है कि हम हाल ही में एक परियोजना पर लागू किया जिनमें से एक कस्टम व्यवहार .htc जो अगर .gif को .png विस्तार बदलता है कहा जाता है एक "toGif" वर्ग के साथ हर PNG छवि, सीएसएस में चिह्नित करने के लिए था ब्राउजर को एक समस्या के रूप में चिह्नित किया गया है। हम बस उसी पथ में प्रत्येक पीएनजी के एक जीआईएफ संस्करण को शामिल करते हैं, और यदि ब्राउजर एक ऐसा पाया जाता है जो पीएनजी को सही तरीके से संभाल नहीं पाता है, तो यह छवि के जीआईएफ संस्करण के साथ इसे बाहर कर देता है। इसलिए हम पूर्ण पूर्ण पारदर्शिता और रंग सटीकता के पक्ष में अल्फा मिश्रण को त्याग देते हैं, और केवल तब ऐसा करते हैं जब हम जानते हैं कि यह शायद सही दिखने वाला नहीं है।
यह एक आदर्श समाधान नहीं हो सकता है, लेकिन यह मुझे लगता है कि क्रॉस ब्राउज़र की प्रकृति है।
संपादित करें: असल में अब है कि मैं प्रश्न में परियोजना को देखें, हम एक .htc व्यवहार एक img वर्ग "अल्फा" के साथ-साथ कहा जाता है जो छवि पर सही फिल्टर स्वचालित रूप से tosses के लिए इस्तेमाल किया। तो आप आईई 6-केवल शुद्ध सीएसएस हैक की बजाय जावास्क्रिप्ट का उपयोग कर ब्राउज़र का पता लगा रहे हैं, इसलिए यह थोड़ा और अधिक सुरुचिपूर्ण हो सकता है ... लेकिन यह मूल रूप से वही बात है।
डीएचटीएम व्यवहार लिखने के लिए एक परिचय के लिए, this link आज़माएं। प्रपत्र बटन, पृष्ठभूमि, नियमित रूप से आईएमजी टैग

http://jquery.andreaseberhard.de/pngFix/

यह एक मौजूदा साइट को जोड़ना आसान है, छवियों के सभी तरह संभालती है (,:

Answer 4

यहाँ एक विशिष्ट समाधान मुझे पसंद है, जावास्क्रिप्ट (jQuery) का उपयोग आदि), और अपने सीएसएस को अच्छा और साफ छोड़ देता है।

Answer 5

छवि लोडर आईई 6 के लिए एकमात्र उपलब्ध फिक्स है। ध्यान दें कि यह पीएनजी समर्थन बहुत प्राथमिक है (आईई 7 के साथ भी), और लूप पारदर्शी पृष्ठभूमि को सही तरीके से संभाल नहीं सकता है। एक पारदर्शी कंटेनर वाली वेबसाइट तैयार करने की कोशिश करते समय मैंने यह कठिन तरीका सीखा। निश्चित रूप से फ़ायरफ़ॉक्स में पूरी तरह से काम किया।

ठीक पृष्ठभूमि और किसी भी पारदर्शी अग्रभूमि ग्राफिक्स के छोटे क्षेत्रों के लिए ठीक होना चाहिए, लेकिन फिर मैं एक वेबसाइट इंटरनेट एक्सप्लोरर के साथ पारदर्शिता की बड़ी मात्रा का उपयोग करता है डिजाइन करने के खिलाफ सलाह देंगे।

अंत में मेरा समाधान आईई के लिए एक फ्लैट रंग प्रदर्शित करना था, लेकिन अन्य ब्राउज़रों के लिए पारदर्शिता बरकरार रखी। सौभाग्य से अंत में डिजाइन को बहुत ज्यादा नुकसान नहीं पहुंचाया।

Answer 6

इस के चारों ओर एक और तरीका है 2 अलग छवियों, जैसे एक GIF और एक पारदर्शी PNG उपयोग करने के लिए, और उसके अनुसार अपनी सीएसएस को लक्षित है:

/* for IE 6 */ 
#banner { 
    background:url(../images/banner.gif); 
} 

/* for other browsers */ 
html > #banner { 
    background:url(../images/banner.png); 
} 

IE 6 सीएसएस बच्चे चयनकर्ताओं तो नहीं समझती नियम की अनदेखी करेंगे, जबकि ब्राउज़र जो इसे समझते हैं, आपको एक अच्छा पारदर्शी पीएनजी देगा।

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

Answer 7

यहां 2 विकल्प हैं जो AlphaImageLoader फ़िल्टर का उपयोग नहीं करते हैं।

• DD_belatedPNG by Drew Diller: अल्फाइमेजलोडर फ़िल्टर के बजाय एक वीएमएल-आधारित समाधान का उपयोग करता है।
• PNGPong: एक फ्लैश आधारित समाधान

मेरे लिए, अगर भेजने उलझा हुआ IE6 के लिए .gif केवल संभव नहीं है, मैं Fireworks to add an IE6-friendly palette to the .PNG का प्रयोग कर एक।