‘menü’ etiketi için sonuçlar

IE8 Açılır Menü İçindeki Input Alanı Üzerince Gelince Menü Kapanma Sorunu

Sorun tam olarak şu; açılır bir menü eğer bir resim üzerinde ise menü içindeki input alanı üzerine gelince menü istem dışı olarak kapanıyor. Diğer hiç bir tarayıcıda sorun yokken ie8 bu durumda sorun oluşturuyor.

İnternet Explorer’ın sorunlarına alışmış bu bünye Microsoft’un bu yeni nesil eskimiş tarayıcısından böyle bir sorun olmasını yadırgamadı açıkçası. Soruna ie7 gibi yorumlama kodunu ekleyerek çözmek istedim ama kod sitenin dinamik kısımlarında çalışırken statik kısımlarında çalışmadı.

Bu iş ile bir projede karşılaştım, proje ismini açıklamak sakıncalı olabilir diye ben size benzer bir örnek kodunu vereceğim. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function() {
	$('a').hover(function(){
		$(this).children(':last').show();
	},
	function(){
		$(this).children(':last').hide();
	});
 });
</script>
<style type="text/css">
a{ position:relative;}
	a div{display:none; padding:20px; background-color:#999; width:250px; position:absolute; top:18px; left:0}
		a div input{ background:transparent}
</style>
</head>

<body>
<a href="javascript:;">menu aç
<div><input type="text" /></div>
</a>
<p><img src="http://www.fatihhayrioglu.com/wp-content/ie7_kaydirma_cubugu.jpg" width="450" height="398" /></p>
</body>
</html>

Örneği görmek için tıklayınız.

Bende sorunu araştırmaya başladım ve sonunda buldum. Sorun input‘a atanan background:none veya background:transparent tanımlamalarından kaynaklanıyor. backgorund’a renk veya resim tanımı yapınca sorun çözülüyor.  

Ben tasarıma uymak için background’a resim tanımlayarak sorunu aştım.

Kaynak

11 Eylül 2008 web’den seçme haberler

  • jQuery ile yapılmış güzel bir efekt. Bağlantı
  • FireFox, Opera ve Webkit’den sonra Internet Explorer’da kendi özel ön ekini CSS özelliklerine eklemiş. Bağlantı
  • Partilerin İnternet Stratejileri – hasanyalcin.com Bağlantı
  • TechCrunch50′den ilk gün izlenimleri – webrazzi.com Bağlantı
  • CSS ile Konumlandırma ilgili güzel bir ipucu uyugulama. Bağlantı
  • WordPress 2.6.2 sürümü çıkmış yükselttim. Yaklaşık 5 dakikamı aldı. Bir sorun görünmüyor.
  • Form girdi alanlarını maskelemk için jquery ile yapılmış bir script. Bağlantı
  • CSS sıfırlama teknikleri hakkında güzel bir makale. Bağlantı
  • Google Chrome’dan beklenen 10 şey. Bağlantı
  • Web kod yazarları için 20 Firefox eklentisi. Bağlantı
  • Güzel <hr> örnekleri. Bağlantı
  • Neden Webkit yükselirken Mozilla düşüşe geçti. Bağlantı
  • CSS 3.0 çalışmalarını sürdüren grup kenarlık(border) ve ardalan(background) üzerine son çalışmalarını tamamlamış. Bağlantı 
  • Tek tıklama ile dosya göndermek için jquery eklentisi. Bağlantı 
  • jQuery ile menü elemanlarına efekt vermek. Bağlantı 
  • Wordpress Temanızdan Silebileceğiniz 13 Etiket – alemsite.com geçen haberlerde bahsettiğim konuyu Selman Kara Türkçeye çevirmiş. Bağlantı

13 Mayıs 2008 web’den seçme haberler

  • Doğrulamadan geçen bir saydamlık uygulaması. Bağlantı
  • Güzel bir menü örneği(mootools ana sayfasındaki gibi) jquery yardımı ile yapımını anlatan bir makale. Bağlantı
  • Arama motorlarına uygun siteler yapmak için güzel uyarılar. Bağlantı
  • “DOM (Document Object Model/Belge Nesne Modeli)” – Berker Peksağ Bağlantı
  • “Web tabanlı Trojan Nasıl Yapılır?” – Azer Koçulu Bağlantı
  • “WordPress Türkçe 2.5.1″ – wordpress.tr Bağlantı
  • Blog ödülleri sahiplerini bulmuş. Bağlantı
  • Opera Drangfly çıkarmış. Firefox Firebug benzeri bir araç. Bağlantı
  • ““Güvenilir Yorumcular” isminde bir WP eklentisi yazdım” – eburhan.com Bağlantı
  • “İnternet’te Reklam ve Banner Standartları” – Hasan Yalçın Bağlantı
  • “Yeni PR Güncellemesi ve MMistanbul’un Büyük Başarısı” internetdevri.com Bağlantı
  • ” Dreamweaver ile Hızlı Menü (Jump Menu) Yapımı” t-infection.com Bağlantı

21 Nisan 2008 web’den seçme haberler

  • Asp.net MVC kaynak kodları yayımlandı. MVC üzerine bir makale. Bağlantı
  • Asp.net MVC ile adım adım kod yazmak. Bağlantı
  • CSS ve javascript ile yapılan çok sevimli menüler. Bağlantı
  • Web formların farklı ve güzel alternatifler. Bağlantı
  • Zaman kazandıracak 10 Gmail ipucu. Bağlantı
  • jquery ile zebra tablolar yapmak. Bağlantı
  • CSS başlangıç dosyaları üzerine farklı bir değerlendirme. Bende katılmıyor değilim.Bağlantı
  • Google PageRank değerlerini nasıl belirliyor. Bir çok kişi bu konu üzerinde kafa yoruyor. Google’dan bir açıklama, ama biraz politik bir açıklama gibi. Bağlantı
  • Mootools 1.2 kullanarak dinamik CSS kodu eklemek. Bağlantı
  • CSS anaçatıların listesi. Bağlantı
  • Asp.net sayfalarımızda klavye kısa yollarını kullanmak. Bağlantı
  • 21′den fazla ajax/javascript ile yapılmış resim galerisi. Bağlantı

11 Kasım 2007 Web’den Seçme Haberler

  • CSS ile yapılmış parlak yatay menü örnekleri Bağlantı
  • Birden fazla sınıf ataması hakkında güzel bir çalışma. Bağlantı
  • Paypal’ın yeni sitesi üzerine değerlendirme yazısı. Bağlantı
  • MooTools javascript kütüphanesi ile yapılmış güzel bir takvim uygulaması. Bağlantı
  • PHP ve CSS ile dinamik metin yerine resim koyma metodu. Bağlantı
  • Asp.net projelerinizde tablo yerine div kullanmayı anlatan bir makale, ayrıca makalede div ile kodlamanın kazandırdığı performansı da gösterilmiş. Bağlantı
  • Etiket bulutu örnekleri. Bağlantı
  • IE6′daki saydam PNG’lerdeki sorunu çözmek için bir metod Bağlantı
  • Firefox 3 betası çıktı ilk izlenimler yayınlanmaya başlandı bile. Bağlantı
  • Web’in gelişimini açıklayan güzel bir resim. Bağlantı
  • IE flash dosyalarını gösterirken etrafına gri çerçeve tıklama sorunu çözmüş “Click To Activate”. En azından güncelleme yapacak kullanıcılar için. Bağlantı

İçiçe Float Elementlerinin Kullanımı

İçiçe float elementlerinin kullanımı basit bir kodlama ile bize çok güzel imkanlar sağlar. Bir genel float elementinin sağ üstüne bir float element yerleştirelim. Bu kodlama genelde menü ve resim ekleme gibi durumlar için kullanılır.
Okumaya devam edin »

Kategoriler

Kitap

CSS'e başlangıç Uzun süredir üzerinde çalıştığım CSS’e başlangıç kitabımı bitirdim. Aslında buna bir kitap demek ne kadar doğru bilmiyorum. Tam doğru tanımı makalelerimin derlenip düzenli hale getirildiği bir e-doküman demek daha doğru olur. Bu kitap makalelerimi derleyip hazırladığım ilk kitap. İnşallah ikinci kitabıda yazmayı düşünüyorum. Zaman ve imkânlar nispetinde 2. kitapta çıkacaktır.