iframe shimming أو IE6 (وأدلي) حدد Z-index Bug

Question

uhm لست متأكدًا مما إذا كان أي شخص قد واجه هذه المشكلة
وصف موجز على IE6 أي <select> يتم عرض الكائنات على أي عنصر آخر ، حتى Div ... بمعنى أنه إذا كان لديك تأثير JavaScript رائع يعرض Div من المفترض أن يكون على رأس كل شيء (على سبيل المثال: Lightbox ، Multibox إلخ ..) Div يتداخل <select> سيتم عرض Div الخاص بك كما لو كان تحت <select> في هذه الحالة ، لا يعمل الحد الأقصى والحد الأدنى لـ Z-Endex

لقد جربت Googling ووجدت حل Iframe Shim
لكنني أردت بعض البدائل النظيفة أو الأفضل من ذلك ، هل وجد أي شخص حلاً أفضل؟ نظرًا لأن الطريقة التي تستخدم iframes تستخدم حوالي 130 ميجابايت من ذاكرة الوصول العشوائي قد تبطئ آلات الفقراء

Answer 1

ليس عليك إخفاء كل select باستخدام حلقة. كل ما تحتاجه هو قاعدة CSS مثل:

* html .hideSelects select { visibility: hidden; }

و javaScript التالية:

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

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

(أو يمكنك استخدام المفضل لديك addClass / removeClass تطبيق).

Answer 2

يوجد مكون إضافي لـ jQuery يسمى bgiframe وهذا يجعل طريقة iframe سهلة التنفيذ.

شخصيا ، كمطور ويب ، أنا إلى النقطة التي لم أعد أهتم فيها بتجربة المستخدم في IE6. سأجعلها تقترب من "الصحيح" قدر الإمكان ، وتأكد من أنها وظيفية ، ولكن بقدر ما تسير السرعة ، سيئة للغاية. يمكنهم الترقية. IE7 (على الرغم من أنه لا يزال بطيئًا جدًا ، مقارنةً بكل متصفح آخر) قد خرج لمدة عامين (تقريبًا حتى اليوم!). IE8 سوف يكون خارج قريبا. Firefox متاح لكل منصة. Safari هو أيضا خيار (وسريع سوبر). الأوبرا متاحة لمعظم/كل منصة.

تم إصدار IE6 منذ أكثر من 7 سنوات. IMHO ، لا يوجد سبب للاستمرار في استخدامه ، بخلاف المستخدمين الكسولون وأقسام تكنولوجيا المعلومات غير كفؤة (أو إذا كنت مطور ويب).

Answer 3

في حالة اهتمام أي شخص ، إليك بعض رمز اللمعان.

* 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');
}

المرجع: هذا جوهر بواسطة خفية وهذا بعد زاك ليثرمان

Answer 4

قبل IE7 ، كانت القائمة المنسدلة عبارة عن عنصر تحكم "نافذة" مما يعني أنه تم تقديمه كعنصر تحكم مباشرة بواسطة Windows بدلاً من المتصفح الذي يربطه. على هذا النحو ، لم يكن من الممكن أن يدعم الفهرسة Z ضد الضوابط الأخرى المتراكمة.

من أجل الظهور على DDL ، يجب عليك استخدام عنصر تحكم آخر في نافذة ، مثل iframe. يمكنك أيضًا استخدام ميزة IE غير معروفة فقط تسمى Window.CreatePopup () والتي تصنع منبثقة لا جدال فيها بشكل أساسي. يحتوي على قيود ، مثل النقر الذي لا يمكن إيقافه ، لكنها في الواقع مفيدة نوعًا ما إذا كنت تقوم ببناء نظام قائمة Hover.

Answer 5

تم العثور على حل أبسط وأكثر أناقة لهذا الخطأ IE المزعج في: http://docs.jquery.com/plugins/bgiframe باستخدام jQuery.

لقد وصلت إلى هذا الاستنتاج بعد محاولة لمدة يومين لجعله يعمل مع تطبيقات WebSphere Portal / Portal حيث يكون كل شيء ديناميكيًا ، بما في ذلك قائمة Fly-Over.

Answer 6

هناك أيضًا طريقة ActiveX ، التي بدأت في استكشافها. يتطلب إنشاء رمز مشروط لاستخدام عنصر تحكم ActiveX بدلاً من مربع تحديد لـ IE6. هناك البرنامج النصي التجريبي إظهار التقنية ، وهو ناقش بمزيد من التفصيل هنا.

تحديث: يبدو أن MS Office مطلوب لتحكم Active-X على جهاز المستخدم. من الناحية النظرية ، قد يكون من الممكن تضمين ذلك في مكان ما ، بطريقة أو بأخرى ، لكن هذا أكثر فوضى.

Answer 7

أعلم أن الكثير من الناس اقترحوا نصائحهم الخاصة ، لكن في حالتي ، أختبئ ببساطة تحديد استخدام jQuery مثل أدناه.

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