هل مؤشر z هو الطريقة الوحيدة لفرض وضع عنصر فوق عنصر آخر، إن لم يكن ما هي الطرق الأخرى الموجودة؟

StackOverflow https://stackoverflow.com/questions/687849

  •  22-08-2019
  •  | 
  •  

سؤال

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

أريد التأثير المعاكس (يغطي النافذة div).لقد اعتقدت أن هذا سيكون مجرد مشكلة في مؤشر z ولكني غير قادر على تشغيله.هذا مع IE7 ومن القراءة قليلاً يبدو أن z-index لن يعمل إلا إذا كان داخل عنصر تم وضعه.

يبدو أن العناصر تم وضعها بشكل صحيح لجعل مؤشر z يعمل بشكل صحيح ولكن لم يحالفني الحظ.لقد تلاعبت بإضافة التصميم عبر Firebug ولكن لم يحالفني الحظ في تغيير أي شيء.النافذة عبارة عن قسمين فقط، أحدهما موضوع تمامًا والآخر قريب بداخله.

هل مؤشر z هو الشيء الوحيد الذي يمكن أن يكون المشكلة هنا أم أن هناك شيئًا آخر لا أعرف عنه؟

هل هناك طرق أخرى لتحقيق التأثير الذي أريده؟لا يمكنني ببساطة إخفاء div عبر jquery أو شيء من هذا القبيل لأن جزءًا منه يجب أن يكون مرئيًا من خلف النافذة التي تفتح على الخريطة.

هل كانت مفيدة؟

المحلول

أنت تضغط على خطأ سياق التراص

http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html

سيؤدي كل div تم وضعه في IE إلى إنشاء سياق تكديس جديد ومنع مؤشر z من سياقات التراص المختلفة ليأتي فوق الآخرين.

الحل هو وضع النافذة التي تريدها في الأعلى في الشجرة (في النص على سبيل المثال) وقيمة مؤشر z أكبر من مؤشر z لجميع أصول القسم الآخر الذي يغطي نافذتك.

معلومات شاملة لفهم المشكلة هنا:http://richa.avasthi.name/blogs/tepumpkin/2008/01/11/ie7-lessons-learned/

نصائح أخرى

وتحديد المواقع وهوامش سلبية هو السبيل الوحيد للحصول على العناصر التي تتداخل وأنا أعلم أن من. ويستخدم مؤشر z فقط أن أقول صراحة المستعرض كيفية طبقة العناصر.

وكما لمشكلتك، IE يتطلب عناصر حاوية و / أو العناصر التي تعتبر متداخلة لposition:relative; أو position:absolute; لض مؤشر للعمل بشكل صحيح. عندما يقول شخص ما وتحديد المواقع انهم عادة ما يعني وجود خاصية position المنصوص عليها في CSS. أيضا عند العمل باستخدام z-index تأكد من أن elementa تداخل هم في نفس المستوى مع بعضها البعض.

ويساعد هذا الأمل

وبكل بساطة، وترتيب العناصر في ملف HTML الخاص بك وسوف تحدد التراص النظام. إذا كنت تريد عنصر ليكون فوق آخر تأكد من أنه يأتي في وقت لاحق HTML ثم.

ويمكنك مبادلة فقط ترتيب التراص على العناصر التي هي كلها في نفس العنصر. على سبيل المثال إذا كان لديك اثنين من عناصر div وكلاهما يحتوي على 3 صور لا يمكنك ان تجعل الصور من شعبة الثاني يذهب أدناه الصور من شعبة الأول.

وتحتاج إلى تخطيط HTML الخاص بك قبل إذا كنت بحاجة إلى أوامر التراص المعقدة.

وكما ألمح من قبل إجابات البعض، position:relative وposition:absolute إعادة تعيين "التراص السياق" في IE.

إذا كنت تريد إجابة أشد كسلا هل يمكن استخدام جافا سكريبت وإخفاء شعبة عند النقر على الخريطة، وتبين أنها عند إغلاق الخريطة.

وسيكون لديك للقيام بذلك مع أي يختار على الصفحة على أي حال لأنه في أي أنها لا تعمل باستخدام z-index.

وجريت إلى هذه المسألة نفسها قبل بضعة أيام وجدت هامش سلبي على النحو الذي اقترحه داركو Z عملت كبيرة. (بلادي مندوب ليست جيدة بما فيه الكفاية حتى الآن على التصويت لصالح داركو)

ولقد كتبت وظيفة سريعة على ذلك.

http://www.swards.net /2009/03/layering-html-elements-without-using.html

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top