Eski tarayıcılar için uyarı verdirmek
İe6 kullanan veya eski tarayıcı kulanan ziyaretçilerinize yeni sürüm yüklemelerini tavsiye etmek isterseniz aşağıdaki kodları bir blok içersine yerleştirip tüm sayfalarda görüntüleyebilirsiniz. Kodda ikaz bölümüne bir ünlem resmi, kapat yazan yere bir çarpı işareti resmi ve tarayıcılarında kendi resimlerini kullanırsanız görsel açıdan da güzel bir uyarı olabilir. Kullanıcılar kapat ı kullanarak sayfanız tekrar yüklenene kadar ikazı kapatmış olurlar. Koidda hatalar veya çakışmalar görürseniz lütfen düzeltin, biraz çabuk paylaşıma hazırladım.
Kod:
<!--[if lt IE 7]>
<div style="border: 1px solid #8CB1FF; background: #DDEEFF; text-align: center; clear: both; height: 75px; position: relative; width:100px">
<div style="position: absolute; right: 3px; top: 3px; font-family: courier new; font-weight: bold;">
<a href="#" onclick="javascript:this.parentNode.parentNode.style.display='none'; return false;">
Kapat</a></div>
<div style="width: 640px; margin: 0 auto; text-align: left; padding: 0; overflow: hidden; color: black;">
<div style="width: 66px; float: left; height:73px">
<p style="text-align: center">İkaz (Dikkat resmi kullanabilirsiniz)</div>
<div style="width: 256px; float: left; font-family: Arial, sans-serif; height:58px">
<div style="font-size: 14px; font-weight: bold; margin-top: 15px;">
Eski Bir Tarayıcı
Kullanıyorsunuz</div>
<div style="font-size: 12px; margin-top: 4px; line-height: 12px;">
Daha iyi bir deneyim
için, modern bir web tarayıcıyı bu
linklerden yükleyebilirsiniz.</div></div>
<div style="width: 55px; float: left; height:73px"><a href="http://www.mozilla-europe.org/tr/firefox/" target="_blank">
Firefox yükle</a></div>
<div style="width: 58px; float: left; height:73px"><a href="http://www.opera.com/browser/download/" target="_blank">
Opera yükle</a></div>
<div style="width: 60px; float: left; height:73px"><a href="http://www.microsoft.com/turkiye/windows/internet-explorer/default.aspx" target="_blank">
İe yükle</a></div>
<div style="width: 62px; float: left; height:73px"><a href="http://www.apple.com/safari/download/" target="_blank">
Safari yükle</a></div>
<div style="float: left;"><a href="http://www.google.com/chrome?hl=tr" target="_blank">
Google chrome yükle</a></div>
</div></div>
<![endif]-->
<div style="border: 1px solid #8CB1FF; background: #DDEEFF; text-align: center; clear: both; height: 75px; position: relative; width:100px">
<div style="position: absolute; right: 3px; top: 3px; font-family: courier new; font-weight: bold;">
<a href="#" onclick="javascript:this.parentNode.parentNode.style.display='none'; return false;">
Kapat</a></div>
<div style="width: 640px; margin: 0 auto; text-align: left; padding: 0; overflow: hidden; color: black;">
<div style="width: 66px; float: left; height:73px">
<p style="text-align: center">İkaz (Dikkat resmi kullanabilirsiniz)</div>
<div style="width: 256px; float: left; font-family: Arial, sans-serif; height:58px">
<div style="font-size: 14px; font-weight: bold; margin-top: 15px;">
Eski Bir Tarayıcı
Kullanıyorsunuz</div>
<div style="font-size: 12px; margin-top: 4px; line-height: 12px;">
Daha iyi bir deneyim
için, modern bir web tarayıcıyı bu
linklerden yükleyebilirsiniz.</div></div>
<div style="width: 55px; float: left; height:73px"><a href="http://www.mozilla-europe.org/tr/firefox/" target="_blank">
Firefox yükle</a></div>
<div style="width: 58px; float: left; height:73px"><a href="http://www.opera.com/browser/download/" target="_blank">
Opera yükle</a></div>
<div style="width: 60px; float: left; height:73px"><a href="http://www.microsoft.com/turkiye/windows/internet-explorer/default.aspx" target="_blank">
İe yükle</a></div>
<div style="width: 62px; float: left; height:73px"><a href="http://www.apple.com/safari/download/" target="_blank">
Safari yükle</a></div>
<div style="float: left;"><a href="http://www.google.com/chrome?hl=tr" target="_blank">
Google chrome yükle</a></div>
</div></div>
<![endif]-->
Yorumlar
Evet dediğiniz gibi yapıyorum. Çalışıyor da...
Fakat IE6 da uyarı ile çıkan uyarı mesajı düzgün görüntüleniyorken IE7 de bu mesajın arka planı kaymış durumda görünüyor.
Dediğim gibi ie 6 için css ayarlarıda dahil css ile bu bozukluğu kolayıkla düzeltebilirsiniz. Bir kaç inceleme yaparsanız çözülür. Askerde olduğumdan güncellemek için tam yardımcı olamayacağım.
Teşekkürler çok işime yaradı görsel açıdan da biraz süsledim çok güzel oldu da bir sorum var. Bu kod şu an ie 5 ve 6 da stabil olarak çalışıyor. Peki ie 7 de de böyle bir uyarı çıkarmak için ne yapmamız lazım.
şimdiden teşekkür ederim.
Kodda bulunan
<!--[if lt IE 7]>
kodunu (ie 7. sürümü değilse) 8 için uyarlarsanızveya 9 için istediğiniz olacaktır.Yeni yorum veya soru gönder