Geçen hafta felsefe profesörü Ali Osman Gündoğan‘ın kişisel web sitesini yayına aldım.

Ali Osman Gündoğan
Tasarımını ve kodlamasını yaptığım web sitesinde kullandığım kodlardan ikisini paylaşmak istiyorum.

1. Rastgele değişen başlık resmi:

Elinizde bol miktarda görsel var ama sayfa sayınız toplamda 5-6. Bu durumda tüm görselleri değerlendirebileceğiniz iyi bir çözümdür rastgele görseli getirmek.

Aşağıdaki kodu PHP’nin rastgele sayı üreten fonksiyonundan faydalanarak yazdım.

Kodla yapmak istediğim, Ali-Osman-Gundogan-1.jpg,Ali-Osman-Gundogan-2.jpg, … şeklinde standart olarak adlandırdığım görselleri rastgele gösterebilmek.

Ali Osman Gündoğan

<img src="Images/Ali-Osman-Gundogan-<?php echo(rand(1,6)); ?>.jpg" />

2. XML’den veri okuyan duyurular:

Bu ihtiyacım için Dynamic Drive’ın yayınladığı DOM XML ticker scriptini kendi tasarımıma uyarladım.

Bir XML ve JavaScript dökümanından oluşan bu yapının saf çıktısını burdan görebilirsiniz.
Siz de bu kodu kendi çalışmanız için uyarlamak isterseniz tek yapmanız gereken

var tickercontainer='<div id="container" style="background-color:#FFFFE1;
width:150px;height:120px;font:normal 13px Verdana;"></div>'

satırıyla biraz oynamak. Bu örnekte arkaplan rengi #FFFFE1, genişliği 150px, yüksekliği ise 120px, fontu da 13px boyutunda Verdana.
Kendi kullandığım kodda div’imin özelliklerini css belgemde tanımlamak istediğim için ve adının da sitedeki kod bütünüyle uyumlu olmasını tercih ettiğim için yukarıdaki kod satırını

var tickercontainer='<div id="xml-Duyuru"><p></p></div>'

olarak değiştirdim. Script “container” id’sini baz alarak çalıştığı için de getElementById(“container”) yazan tüm satırları getElementById(“xml-Duyuru”) olarak değiştirdim. css belgemde de xml-Duyuru id’li div’imi de aşağıdaki gibi tanımladım.

#xml-Duyuru{ height:100px; margin-bottom:25px;font-size: 1.2em; line-height:1.5em;}

ticker.xml belgesinde görünmesini istediğim duyuruları yazdım. Yazıların görünme zamanı kısa geldiği için duraklama süresini de 3500 olarak değiştirdim.

Kendi siteme uygun modifiye ettiğim haliyle, DOM XML Ticker’ın çıktısı bu hale geldi.

Ekleme (30 Eylül 2009): Aynı kodu Clubcrema için kullandım.
Bir arama yapıp da bulamayınca farklı farklı kişiler sizin için aradığınızı bulamıyor:)