Metnin harflerini büyütüp küçültmek için <font size="..."> komutundan yararlanıyoruz. HTML özniteliği 1'den 7'ye kadar değer alıyordu. Bir harf 50 milisaniye aralıklarla 1, 2, 3, 4, 5, 6, 7, 6, 5, 4, 3, 2, 1, 2, 3... gibi yükselip alçalan değerler alarak dalgalı şekilde büyüyüp küçülmeli. Hemen sağındaki harf de bir adım geriden takip etmeli.
Bu dalgalanmayı sağlamak için başka bir çok yol bulabilirsiniz. Lise matematiğinden hatırlayacağınız üzere sinüs fonksiyonu 1 ve -1 ekstrem değerleri arasında bir dalga grafiğine sahiptir. Negatif değerler işimize yaramayacağından dolayı; mutlak değer sinüs fonksiyonu kullanarak 0 ile 1 arasında bir dalgalanma oluşturuyoruz. (aslında dalgalanmadan çok ardısıra dizilen tepeciklere benzer.)
Bilmeniz Gereken Komutlar:
değişken.length
değişken.substring(ilk harfin sırası, son harfin sırası)
setTimeout(komut, süre)
Math.abs(sayısal ifade)
Math.sin(radyal cinsinden sayısal ifade)
parseInt(sayısal ifade)
Sonuç Kodlarımız:
<html>
<head>
<title>Karakter sayısı</title>
<script language="JavaScript">
var metin = "Büyük Altay";
function Dalgala
{
Boyutla(metin,n);
if (n > metin.length) {n=0}
setTimeout("Dalgala(" + (n+1) + ")", 50);
}
function Boyutla(yazi,sayi)
{
son_hal = "";
for (i = 0; i < yazi.length; i++)
{
font_degeri = parseInt(72*Math.abs( Math.sin((i+sayi)/(yazi.length/3.14))) );
son_hal += "<font style='font-size: "+ font_degeri +"pt'>" +yazi.substring(i,i+1)+ "</font>";
}
katman.innerHTML = son_hal;
}
</script>
</head>
<body onload="Dalgala(0)">
<div id="katman" align="center">
</div>
</body>
</html>
Arkadaşlar ne yazık ki örnek bir resim ekleyemiyorum çalışma hareketli olduğu için... Ama eğer isterseniz çeşitli kod deneme sitelerinde kodu kontrol edebilirsiniz...