Javascript ile manşet alanı birçok sitede kullanılan bir yöntem. Özellikle haber sitelerinde kullanılıyor. Bende bunun yapılışını basit bir şekilde anlatacağım. Öncelikle yapacağımız uygulamanın görüntüsü şöyle olacak.Şimdi de yazacağımız javascript kodlarına bakalım.
function getir(kontrol,image,back,text){
document.getElementById("manset").src = image;
document.getElementById(kontrol).style.color = text;
document.getElementById(kontrol).style.backgroundColor = back;
}
function out(kontrol,renk,text){
document.getElementById(kontrol).style.backgroundColor = renk;
document.getElementById(kontrol).style.color = text;
}
Şimdi ise html tarafında bu fonksiyonları nasıl çağıracağımıza bakalım.
<div id="1" class="asd" onmouseover="getir('1','img/1.jpg','blue','white')" onmouseout="out('1','#dcdcdc','black')">Başlık1</div>
Javascript ile yazdığımız getir fonksiyonunda kontrol parametresi ile hangi kutunun üzerine geldiğimizi elde ediyoruz. İmage parametresi ile kutunun üzerine geldiğimizde hangi resmin yükleneceğini belirliyoruz. back ve text ile de üzerine geldiğimiz kutunun arka plan rengini ve text rengini belirliyoruz.
Sonuçta yukarıda elde ettiğimiz gibi alanımızı bitirmiş oluyoruz. Tasarım kısmı size kalmış. İstediğiniz gibi tasarlayabilirsiniz.
