سؤال

لقد تعمل على مشكلة صغيرة اليوم:لدي شبيبة القائمة المنسدلة عندما إدراج غوغل...القائمة المقدمة من وراء خريطة جوجل...أي أفكار حول كيفية فرصة z فهرس جوجل خريطة ؟

وذلك بفضل!

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

المحلول

إذا كانت المشكلة تحدث في Internet Explorer ، ولكن ذلك يجعل الطريق كنت تتوقع في فايرفوكس أو سفاري ، هذا الرابط كانت مفيدة للغاية بالنسبة لي مع مشكلة مماثلة.

يبدو أن تختزل إلى فكرة أن تمييز عنصر مثل "position:relative;" في CSS أسباب IE6&7 إلى فوضى مع انها z-مؤشر نسبة إلى العناصر الأخرى التي تأتي قبل ذلك في مستند HTML في unintuitive ومكافحة المواصفات الطرق.يفترض IE8 يتصرف "بشكل صحيح" ولكن لم أجربها بنفسي

Anutron نصيحة سيكون من المفيد حقا إذا كانت لديك مشكلة مع <SELECT> شكل العنصر, ولكن إذا كنت تستخدم جافا سكريبت التلاعب divs أو uls أن يتصرف مثل المنسدلة أنا لا أعتقد أنها سوف تساعد.

نصائح أخرى

علما بأن القوائم المنسدلة في بعض المتصفحات (مهمأي*مهم) لا يمكن zPositioned على الإطلاق.سوف تحتاج إلى استخدام "iframe شيم" إلى طمس أو إخفاء القائمة المنسدلة تماما إذا كنت تريد وضع شيء فوق ذلك.انظر: http://clientside.cnet.com/wiki/cnet-libraries/02-browser/02-iframeshim

الخريطة بالفعل ملفوفة داخل div.تعطيه السلبية z-مؤشر يعمل - مع التحذير واحد:على gmaps الضوابط ليست قابلة للنقر.

إذا القائمة الخاصة بك هي ملفوفة في شعبة الحاوية على سبيل المثال #menuWrap ثم تعيين موقف قريب تعطيه ارتفاع z-index....على سبيل المثال

#menuWrap {
  position: relative;
  z-index: 9999999
}

تأكد من الخريطة داخل div

حاول إعداد القائمة الخاصة بك z-index بجنون عالية. على ما يبدو خرائط جوجل يستخدم مجموعة من -9000000 إلى 9000000.

التفاف الخريطة في شعبة التي DIV z-مؤشر من 1.التفاف المنسدلة في شعبة وإعطائها قيمة أعلى.

أي يعطي المشكلة

كل شعبة التي هي ملفوفة في النسبية وضع div سوف تبدأ من جديد z-index في IE.الطريق أي يفسر الخارجي النسبية divs ، وذلك من html.آخر تعريف هو على القمة.بغض النظر عن z-فهارس divs داخل النسبي المتمركزة هي divs.

حل أي:تحديد الدرجة التي يجب أن تكون على أعلى في الماضي في html.

(حتى z-مؤشر يعمل في IE ، ولكن فقط في حامل div كل حامل div مستقلة عن الأخرى حامل divs)

z-index (خصوصا في Internet Explorer 7) لم يكن يعمل حقا بالنسبة لي.حاولت العديد من تركيبة مختلفة من عالية مقابلانخفاض خريطة z-المؤشرات ولكن قد لا الفرح.

حتى الآن أبسط/أسرع الإجابة بالنسبة لي هو إعادة ترتيب بلدي علامة المتابعة/css إلى وflyouts/الانقلاب المدرجة في علامة المتابعة سبق/قبل الخريطة (حرفيا, قبل <div id="map">), بهذه الطريقة أستطيع السماح z-index تبقى الافتراضي (auto) والانتقال إلى جوانب أكثر أهمية من webapp ;)

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

<ul id="rollover">
<li><a href="#here">There</a></li>
</ul>
<div id="map">...</div>

أنا خلقت جوجل النمط المنسدلة و نفس المشكلة...باستخدام V3 api خرائط جوجل, يمكنك فقط إنشاء عنصر تحكم ووضعه على الخريطة باستخدام:

map.controls[google.map.ControlPosition.TOP].push(control);

لأنه هو المنسدلة, فقط تأكد من z-مؤشر تحتوي div أعلى (z=3) ثم من القائمة المنسدلة جزء يحتوي على عناصر القائمة أقل أن تحتوي شعبة (z=0).

هنا على سبيل المثال.

من تجربتي المرة الوحيدة التي تحتاج إلى استخدام الحشوات هي الإضافات (مثل Google Earth).

لا تحتاج إلى تعيين z-index لكل من الخريطة القائمة.إذا كنت ببساطة تعيين مؤشر z من القائمة أعلى من الخريطة لن تعمل بالضرورة.

تعيين z-مؤشر الخريطة div -1.الآن سوف القائمة المنسدلة عرض على الخريطة.........ولكن إذا كنت تستخدم المجمع ثم الخريطة لن تكون تفاعلية كما هو الآن خلف المجمع.

كمحاولة للتغلب على هذه استخدم onmouseover و onmouseout وظائف في المجمع div.تأكد في المجمع div وليس الخريطة div.

onmouseover="getElementById('map').style.zIndex = '10000';" 

onmouseout="getElementById('map').style.zIndex = '-1';"

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

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