‘ie’ etiketi için sonuçlar
İnternet Explorer’da sağdaki sabit kaydırma çubuğunu kaldırmak
Şubat 11th, 2010 • 6 yorum CSS
Etiketler: ie, ie6, ie7, ipucu, kaydırma-çubuğu, overflow
Pek nadirde olsa böyle bir istek ile karşılaşıyorum. Bu ikinci oldu. İlk başta bunun bir çözümü yoktur diye düşündüm(Bunu düşünmemin nedeni daha önce böyle bir istek ile karşılaştığımda çözümünü bulamadım diye aklımda kalması). Ancak sonra bazı sitelerde böyle bir şey yapıldığını görünce, araştırmaya karar verdim ve çözümü buldum.
Genelde %100 flash sayfalarda veya kendi içinde kaydırma çubuğu çıkan sayfalarda bu tip bir istek geliyor.
Firefox, İnternet Explorer 8, Safari, Google Chrome gibi yeni nesil tarayıcılar eğer içerik uzun değilse kaydırma çubuğunu göstermiyor. Ancak ie6 ve ie7 de durum böyle değil. İçerik olsun yada olması sağda yatay kaydırma çubuğu daima görünüyor. Bu durumu eşitlemek için çok basit bir kod yazmamız yeteli oluyor.
html {overflow:auto;}
Kaynaklar
IE6′da Liste Ardalan Görmeme Sorunu
Aralık 7th, 2009 • 8 yorum CSS, XHTML
Etiketler: ardalan-görünmeme, ardalan-özellikleri, hata, ie, ie6
İE hatalar serisini devam ediyoruz, ben uğraşmaktan ve yazmaktan bıktım ama ie hata vermekten bıkmadı.
Bu seferki hataya menüde denk geldim. Menüme background-image ile bir ikon koydum, her şey güzel ama ie6 görmedi. Araştırdım ve sonuç ie sorunu çıktı tabiki. Sorunun tam tanımı şöyle; listeleri(ul, ol ve dl) kapsayan elemana eğer float ve position:relative tanımı yaptı iseniz, ie6 liste background özelliklerini(resim veya renk) görmüyor.
Bu durmu bir örnek ile gösterelim.
<!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>ie lsite ardalan sorunu</title>
<style>
#menuKapsul{
position:relative;
float:left;
}
ul li{
background:url(ikon.gif) 3px 9px no-repeat;
list-style:none;
padding-left:12px;
}
</style>
</head>
<body>
<div id="menuKapsul">
<ul>
<li>Liste 1</li>
<li>Liste 2</li>
<li>Liste 3</li>
</ul>
</div>
</body>
</html>
Yukarı görülen basit bir listenin ardalanına resim yerleştiriyoruz. Kapsayıcı elemanada position:relative; ve float:left; tanımları atanmış olsun. Aktif tarayıcıların tümünde sorunsuz çalışan kodumuz, ie6′da sorunlu görünecektir. Sorun liste ardalan resminin görünmemesidir. Sorunu çözerken bayağı bir cebelleşmiştim. Sonunda çözümü bulunca ve bu çözümde çok basit olunca sevineyim mi üzüleyim mi şaşırdım.
Çözüm ise çok basit. Ardalan resmi uyguladığımız liste öğesine postion:relative tanımı yapıyoruz ve bu kadar düzeliyor.
ul li{
background:url(ikon.gif) 3px 9px no-repeat;
list-style:none;
padding-left:12px;
position:relative
}
bu kadar bu kod bizim sorunlarımızı gideriyor.
Bir başka çözüm yoluda kapsayıcı bir eleman daha ekleyerek bu elemana farklı konumlandırma değeri atayıp çözebiliriz, ama bu pek mantıklı değil, fazladan kod eklememiz gerektiği için. En iyi position:relative ekleyip sonuca gitmek.
Örnek kodu görmek için tıklayınız.
Bir ie6 sorununun daha üstesinden geldik bir başka ie6 sorunu ile daha karşınızda olana dek hoşça kalın.(Bu ie6 oldukça nasıl hoş kalacağız oda ayrı bir konu.)
11 Eylül 2008 web’den seçme haberler
Eylül 11th, 2008 • Haberler
Etiketler: CSS ön eki, css3.0, Google Chrome, ie, jquery, Konumlandırma, menü, upload, WordPress
- 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ı
İnternet Tarayıcıları
Mayıs 12th, 2008 • 9 yorum Haberler
Etiketler: firebug, Firefox, ie, İnternet Tarayıcısı, Opera, safari, web tarayıcısı, WebKit
sayfanın çıktısını al ||
pdf olarak indir
İnternet Tarayıcıları diğer bir ifade ile Web Tarayıcıları, İnternet veya lokal alandaki ağlarda web sayfalarındaki interaktif metin, resim, video, müzik vb. göstermek için kullanılan programlardır. “Vikipedia”
Şu an genelde kullanılan tarayıcılar: Internet Explorer, Mozilla Firefox, Opera ve Safari Okumaya devam edin »
Javascript ile üst Elemanı yakalamak(parentNode & parentElement)
Nisan 16th, 2008 • 4 yorum Javascript
Etiketler: Firefox, ie, Javascript, parentElement, parentNode
Ben şahsen 4-5 defa karşılaştığım bir sorun. İç içe bulunan bir kod yığınında bir nesnenin üst elemanına erişmek için javascript’in hangi özelliğini kullanayım.
Açıkçası ben parantElement özelliğini kullandım her defasında. Ancak Firefox’da çalışmadığını görünce vazgeçtim her seferinde.
Daha sonra aramalar sonucu her ikisininde çalıştırdığı parentNode özelliğini kullanmaya karar verdim.
<!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>parentNode örnek sayfası</title>
</head>
<body>
<form id="DugmeFormu">
<input id="Dugme" type="button" value="Üst elemanı göster" onclick="ustEleman();">
</form>
<script language="JavaScript">
function ustEleman() {
var m = document.getElementById("Dugme").parentNode.id;
alert("Üst elemanı: "+'"'+m+'"');
}
</script>
</body>
</html>
Örnek sayfayı görmek için tıklayınız.
Kaynaklar
01 Mart 2008 web’den seçme haberler
Mart 1st, 2008 • 6 yorum Haberler
Etiketler: CSS, facebook, gtalk, ie, jquery, lightbox, liste, silverlight, text-shadow
- Microsoft Silverlight 2. sürümüne bir göz atalım. Bağlantı
- CSS 3 ile birlikte tekrar gündeme gelen metin gölgeleme(text-shadow) özelliği ve kullanımı üzerine bir makale. Bağlantı
- CSS ile listeler üzerine ayrıntılı bir makale. Bağlantı
- Facebook benzeri otomatik tamamlama scripti. Bağlantı
- Javascript ile flash’a yakın saydam kenarlı alanlar oluşturmak için GlassBox. Bağlantı
- Site menü örnekleri ve trendleri. Bağlantı
- Mobil uygulamalar ölüyor mu? Bir çok sitede mobil yani anlayacağınız cep telefonuna uygulama yazmak ne kadar mantıklı. Bağlantı
- jQuery alt yapısını kullana facebook benzeri lightbox uygulaması. Bağlantı
- CSS ipucu; body kenar çizgisi atama. Bağlantı
- Gtalk ile web sitenizden anında sohbet scripti. Bağlantı
- IE8 de doctype geçişi. Bağlantı
- Yuvarlak kenarlı tab menü yapmak. Bağlantı
- Asp.net ve ajax yardımı ile otomatik metin tamamlama işlemi yapmak. Bağlantı
- “em ve piksel farkı” Bağlantı
- “Web Tarayıcıya Göre Değişebilen CSS Hazırlamak” Bağlantı
