Sayfa Yenileyince Değişen Logo Java Script Kodu

Çok kısıtlı bir zamanda bu konuyu açıyorum. Konuyu açmamın nedeni; şu 2 dakikalık zamanda bulup derlediğim bu kodu paylaşmak. İnternette kolay kolay bulunamayan bu kodun elbette göremediğim hataları olabilir ama hatalar varsa araştırır eklemeler yapar düzeltmeye çalışırız..

DİKKAT! Yazı, 26 Haziran 2010 tarihinde yayınlanmıştır ve erişim sağladığınız tarihte güncelliğini yitirmiş olabilir.

Aslında internette birkaç tane resim değiştiren kod vardı, fakat bunların ufak bir kusuru var; resimlerin boyutlarına müdahele edemiyorsunuz.. Örneğin sayfa yeniledikçe değişecek olan resim bir logo ise, siteyi farklı çözünürlüklerde görüntüleyen kullanıcılarda logolar orijinal boyutlarında çıkacak. Bunun neresi ters derseniz açıklayalım..

Diyelim ki logo 900 piksel genişlikte, sitenize gelenlerden biri 1024 çözünürlük, diğeride 1152 piksel çözünürlükle sitenizi görüntülüyor, bunlardan 1024 piksel çözünürlüklü olanı logoyu siteye uygun boyutta görecek, 1152 çözünürlüklü olan ise logoyu siteye göre çok küçük ve orantısız görecek. Normalde java kodu olmasa resime div tanımlar boyutunu ayarlarız, fakat java kodlarından anlamayan birisi için bu çok zor olacaktır..

Bugünde bir arkadaşım sayfa yeniledikçe değişen logo yapmamı istedi, daha önce kullandığım js kodunu kullandığımda logo olacak 4 resmin boyutlarına müdahele edemiyordum ve kötü görünmesi de içime sinmiyordu. Bende yabancı sitelerde resim boyutları oynanabilir bir js aradım ve nihayet buldum…

Bahsi geçen, çalışan kodları aşağıda bulabilirsiniz.. Resim linklerini logo adresine göre düzenleyin en sondaki width 100%, resimin her ekran oranında %100 görünmesini sağlıyor. İsterseniz piksel cinsi değer verebilirsiniz. Örnekte 5 tane değişen logo alanı var, imagenumber yazan alandaki sayıyı arttırıp yeni logo alanları ekleyebilirsiniz..

<script language="JavaScript">
<!-- Hide from old browsers
var imagenumber = 5 ;
var randomnumber = Math.random() ;
var rand1 = Math.round( (imagenumber-1) * randomnumber) + 1 ;
images = new Array
images[1] = "http://www.site.net/images/1.jpg"
images[2] = "http://www.site.net/images/2.jpg"
images[3] = "http://www.site.net/images/3.jpg"
images[4] = "http://www.site.net/images/4.jpg"
images[5] = "http://www.site.net/images/5.jpg"
var image = images[rand1]
links = new Array
links[1] = "http://www.site.com"
links[2] = "http://www.site.com"
links[3] = "http://www.site.com"
links[4] = "http://www.site.com"
links[5] = "http://www.site.com"
var link = links[rand1]
var Quotation=new Array()
Quotation[1] = "Lordiz"; document.write('<A HREF="' + link + '"><IMG SRC="' + image + '" border="0" width="100%"></a>')
</script>

Konuyla ilgili sorularınızı sorabilirsiniz kod paylaştığım süreçte çalışıyordu gözümden kaçan bir hatası varsa yorum olarak mesajlarınızı bekliyorum.

>> Web Tasarım ile Uğraşanlar için Faydalı Bağlantılar