आइफ्रेम shimming या IE6 (और नीचे) का चयन z- सूचकांक बग

Question

Uhm मुझे यकीन है कि किसी को भी इस समस्या
किसी भी <select> वस्तुओं किसी अन्य मद, यहां तक ​​कि div खत्म हो चुका है प्रदर्शित हो एक संक्षिप्त विवरण IE6 पर है सामना करना पड़ा है, तो नहीं कर रहा हूँ .. जिसका अर्थ है कि यदि आपके पास एक फैंसी जावास्क्रिप्ट प्रभाव है जो एक div को प्रदर्शित करता है जो किसी निश्चित तत्व के शीर्ष पर होना चाहिए (उदाहरण: लाइटबॉक्स, मल्टीबॉक्स आदि ..) एक निश्चित तत्व पर क्लिक करें और वह div <select> ओवरलैप करता है जैसे आपका div इसके तहत है <select> [इस मामले पर एक अधिकतम और न्यूनतम z- सूचकांक काम नहीं करता है]

मैं googling की कोशिश की है और iframe शिम समाधान
पाया, लेकिन मैं कुछ बहुत चाहता था स्वच्छ विकल्प या बेहतर अभी तक किसी को भी बेहतर समाधान मिला है? अगर आईआरएम्स का उपयोग करने वाली विधि 130 एमबी रैम का उपयोग करती है, तो खराब लोगों की मशीनों को धीमा कर सकता है

Answer 1

आपको लूप का उपयोग करके हर select छिपाने की ज़रूरत नहीं है। और

* html .hideSelects select { visibility: hidden; } 

निम्न JavaScript: आप सभी की जरूरत की तरह एक CSS नियम है

//hide: 
document.body.className +=' hideSelects' 

//show: 
document.body.className = document.body.className.replace(' hideSelects', ''); 

(या, आप अपने पसंदीदा addClass/removeClass कार्यान्वयन का उपयोग कर सकते हैं)।

Answer 2

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

डीडीएल पर प्रदर्शित होने के लिए, आपको IFRAME जैसे किसी अन्य विंडो वाले नियंत्रण का उपयोग करना होगा। आप window.createPopup() नामक एक छोटी ज्ञात आईई-केवल सुविधा का भी उपयोग कर सकते हैं जो अनिवार्य रूप से एक क्रोमलेस पॉपअप बनाता है। इसमें सीमाएं हैं, जैसे अदम्य क्लिक-आउट, लेकिन यदि आप होवर मेनू सिस्टम बना रहे हैं तो वे वास्तव में उपयोगी हैं।

Answer 3

bgiframe नामक jquery के लिए एक प्लगइन है जो आईफ्रेम विधि को लागू करने में काफी आसान बनाता है।

व्यक्तिगत रूप से, एक वेब डेवलपर के रूप में, मैं उस बिंदु पर हूं जहां अब आईई 6 में उपयोगकर्ता अनुभव की परवाह नहीं है। मैं इसे यथासंभव "सही" के करीब प्रस्तुत कर दूंगा, और सुनिश्चित कर सकता हूं कि यह कार्यात्मक है, लेकिन जहां तक ​​गति चलती है, बहुत खराब है। वे अपग्रेड कर सकते हैं। आईई 7 (हालांकि हर दूसरे ब्राउज़र की तुलना में अभी भी काफी धीमी है) 2 साल (लगभग दिन तक) के लिए बाहर हो गया है। आईई 8 जल्द ही बाहर जा रहा है। फ़ायरफ़ॉक्स हर मंच के लिए उपलब्ध है। सफारी भी एक विकल्प (और सुपर फास्ट) है। ओपेरा अधिकांश/प्रत्येक मंच के लिए उपलब्ध है।

आईई 6 7 साल पहले जारी किया गया था। आईएमएचओ, आलसी उपयोगकर्ताओं और अक्षम आईटी विभागों (या यदि आप एक वेब डेवलपर हैं) के अलावा, अभी भी इसका उपयोग करने का कोई कारण नहीं है।

Answer 4

सक्रिय कार्य विधि भी है, जिसे मैं एक्सप्लोर करना शुरू कर रहा हूं। इसके लिए i6 के लिए एक चयनित बॉक्स के बजाय एक सक्रिय नियंत्रण नियंत्रण का उपयोग करने के लिए सशर्त कोड बनाने की आवश्यकता है। तकनीक को दिखाते हुए demo script है, जो discussed in more detail here है।

अपडेट: ऐसा प्रतीत होता है कि सक्रिय-एक्स नियंत्रण के लिए एमएस ऑफिस की आवश्यकता उपयोगकर्ता की मशीन पर होनी चाहिए। सिद्धांत रूप में, किसी भी तरह, कहीं भी शामिल करना संभव हो सकता है, लेकिन यह बहुत गड़बड़ हो रहा है।

Answer 5

यदि कोई दिलचस्पी है, तो यहां कुछ आईई शिमिंग कोड है।

* html .shimmed { 
    _azimuth: expression(
     this.shimmed = this.shimmed || 'shimmed:'+this.insertAdjacentHTML('beforeBegin','<iframe style="filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);position:absolute;top:0px;left:0px;width:100%;height:100%" frameBorder=0 scrolling=no src="javascript:false;document.write('+"''"+');"></iframe>'), 
     'inherit'); 
} 

रेफरी: this gistsubtleGradient द्वारा और इस post by Zach Leatherman

Answer 6

कि कष्टप्रद आईई बग के आसान और सबसे सुरुचिपूर्ण समाधान में पाया जाता है: http://docs.jquery.com/Plugins/bgiframe jQuery का उपयोग कर।

मैं वेबस्फीयर पोर्टल/पोर्टल अनुप्रयोगों के साथ काम करने के लिए 2 दिनों की कोशिश करने के बाद उस निष्कर्ष पर पहुंचा जहां फ्लाई-ओवर मेनू समेत सब कुछ गतिशील है।

Answer 7

मुझे पता है कि कई लोगों ने अपनी युक्तियों का सुझाव दिया है, लेकिन मेरे मामले में, मैं बस नीचे की तरह jquery का उपयोग करके चयन छुपाएं।

$(':date').dateinput({ 
    format: 'dd/mm/yyyy', 
    onBeforeShow: function(event) { 
     $('select').hide(); 
    }, 
    onHide: function(event) { 
     $('select').show(); 
    } 
});