Son zamanlarda özellikle haber sitelerinde karşımıza çıkan bir yapının kodlarını sizlerle paylaşmak istedim. Örneğin http://www.yerkoyeml.k12.tr/index.asp veya http://www.igdeagaci.com sitelerindeki haberler gibi yazının/resmin üzerine gelince yanda resim değiştiren kodlarını sizler için derledim.
Kodları sayfanıza eklemek için ilk önce resimdegistir isimli script kodumuzu sayfamıza ekliyoruz.
<script>
function resimdegistir(res1){
var yol;
yol=res1;
document.getElementById("resim1").src=""+yol;
}
</script>
scriptimizi hazırladıktan sonra değişecek resmimize "resim1" ismini veriyoruz.<img name="resim1" src="baslangicResmi"/>
gelelim yan tarafında üzerine geldiğimizde resimleri değiştirecek linkleri yazmaya<a onmouseover="resimdegistir('images/araba.jpg')">Araba</a>
<a onmouseover="resimdegistir('images/kedi.jpg')">Kedi</a>
<a onmouseover="resimdegistir('images/bocek.jpg')">Böcek</a>
linklerimizi de yukarıdaki gibi yazdıktan sonra scriptimiz kullanılabilir duruma gelmiştir.
Script ile ilgili görüşlerinizi yazabilirsiniz. Kolay gelsin
Arama Motoru
rtyucel.wordpress.com: Mesleki Eğitim BT blogu
Pazartesi, Mayıs 26, 2008
Linkin üzerine gelince değişen yanda resimler
Kaydol:
Kayıt Yorumları (Atom)
2 yorum:
Hocam firefoxta malesef çalışmıyor.
Hocam çok teşekkür ederim. Tam istediğim gibi. Ama bir sorun yaşadım. Aynı kodu aynı sayfaya iki farklı şekilde yerleştiriyorum. Ama değişen resimler ayrı ayrı değişmiyor. Ya yukarıdaki yerde tüm resimler değişiyor ya da aşağıda. Ben birbirlerinden bağımsız bir kaçtane olsun istiyorum. BİR AKIL VERİRSEN ÇOK SEVİNİRİM.
Yorum Gönder