2011-07-08 28 views
12

İçinde bir iframe bulunan basit bir CSS açılır menüsü var. Fareyi açılır menünün üzerine getirdiğimde menü düşer. Ancak, fareniz menünün içindeki iframe yerini aldığında, menü geri gider. İşte benim kod basitleştirilmiş versiyonu: Bu FF, Chrome ve Opera son sürümlerinde çalışır: hover IE9'da düzgün çalışmıyor

<div id="comments"> 
    <a href="#" class="btn">View comments</a> 
    <div id="comment-wrap"> 
    <iframe src="http://www.facebook.com/plugins/comments.php?..."></iframe> 
    </div> 
</div> 

<style type="text/css"> 
#comment-wrap{display:none;z-index:5;position:absolute;padding:10px;background-color:#fff;} 
#comments:hover #comment-wrap{display:block;} 
</style> 

.

P.S. Açılan menü, farem # comment-wrap'ın dolgusu dolduğunda düştü.

+0

Bunun için hangi doctype kullanıyorsunuz? –

cevap

1

Ne yazık ki, bu pek çok IE sürümleri geri dönen bir tarayıcı hatası gibi görünüyor. Bir JS çözümünü IE'ye yedek olarak kullanabilirsiniz. Bu sorunu ele alan another solution kodundan jsFiddle example kodu oluşturdum.

Bu yardımcı olur umarım!

Düzenleme: IE9'daki diğer testler, iframe görüntülendiğinde, kaydırma çubuklarının üzerinde gezinmenin hemen gizlendiğini gösterir. Bunun için daha fazla ilgili bir JS düzeltmesi var, ancak uygulamak istiyorsanız bu size kalmış.

17

Hover psuedo sınıfı ile çalışırken benzer sorunlarla karşılaştım. Tarayıcının Belge modunu IE 9'a değiştirdiğimde ve Tarayıcı modu da IE9'a ayarlandığında iyi çalışmaya başladı. IE 9, varsayılan olarak IE8 olarak ayarlanan belge moduna sahiptir.

Ayrıca, kafa etiketinde aşağıdaki meta bilgileri ekleyebilirsiniz: Bu yardımcı olur

<meta http-equiv="X-UA-Compatible" content="IE=9"/> 

Umut.

+0

Merhaba Vilas, belge/tarayıcı modunu nasıl/nasıl/nasıl belirleyeceğinizi açıklar mısınız? Belge modunun sayfa yazarının işaretlemede bir yere koyduğu bir ayar olduğunu, ancak tarayıcı modunun kullanıcının sahip olduğu bir ayar olduğunu mu varsayıyorum? –

+0

Yup Tarayıcı moduna atıfta bulunarak ek olarak aşağıdaki meta bilgiyi başlığa ekleyebilirsiniz

+0

vay bu meta etiketi nasıl yaptı? iş? Sorunumu tamamen düzeltti! – christopher

0

Kısa süre önce IE10'da (alt sürümlerden emin değilim) bir çılgınlık sorunu yaşadım ve bu beni çıldırtıyordu. Css hover'ım düzgün ayarlanmıştı ve bir iframe içeren bir div içindi. Mesele şu ki, div'u gezdirdiğinizde iframe gösterecektir, ancak fareyi iframe götürmeye çalıştığınız anda tekrar yok olacaktır. Her yerde aradım ve javascript veya jquery kullanmak dışında benim için kabul edilebilir bir cevap için hiçbir şey bulamadım. Bunu çözmeye çalışırken günler sonra benim için çalışan çok basit bir çözüm buldum. Ben sadece div gelen iframe kaldırıldı ve bu millet araştırma çok zaman tasarrufu sağlar umut böyle

<div class='showme'>links<div style='float:left;' class='showme_1'> 
    <object type='text/html' data='http://www.google.com' style='width:100%; height:100%' border='0'> 
    </object> 
</div> 

olarak nesne kullandı.

4

Aynı problemi buldum ve bunun eski bir yazı olduğunu biliyorum ama çözümümü yayınlamak zorunda olduğumu hissettim. Temel olarak IE,olayını, 10 (href) ile belirtilen herhangi bir etiket için kabul etmez (ilk sürümlerde çalışmayacaksınız), <!DOCTYPE HTML> numaralı bağlantıyı eklemediğiniz sürece. Ve işte bu! Sorun çözüldü :).

+4

Sadece bir oylamada ne olursa olsun hiçbir açıklama yapmadan aşkı seviyorum: P. Oy vermek zor, haklı göstermek zor mu? Bana ve kim olursa olsun SO'ya yardım eder ve bu sorunun cevabını arar, neden oy (yukarı veya aşağı) verilir? Deneyimimi yardım etmek ve farklı bir seçenek eklemek için paylaştım. Çoğu zaman en çok oylanan cevabın benim için işe yarayan bir çözüm olmadığını anladım. Kişisel bir sorun değil, sadece yapıcı olmaya çalışıyorum. –