1. Anasayfa
  2. Javascript

JavaScript Örnekleri – Fare Yazının Üzerine Gelince Değişen Resim


0

JavaScript Örneklerimize fare yazının üzerine gelince değişen resim uygulaması ile devam ediyoruz, uygulamamızda yazının onmouseover olayına göre çelışacak olan fonksiyona bir sayısal değer gönderiyoruz. Bu değere karşılık gelen resim de img nesnesinin src parametresine atanıyor.

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>http://www.bilisimogretmeni.com/</title>
    <script type="text/javascript">
    function resim_degis(ind)
    {
        var res = document.getElementById("rsm");
        var res_dizi = new Array();
        res_dizi[0] = "http://www.bilisimogretmeni.com/images/cicek.jpg";
        res_dizi[1] = "http://www.bilisimogretmeni.com/images/dag.jpg";
        res_dizi[2] = "http://www.bilisimogretmeni.com/images/penguen.jpg";
        res.src = res_dizi[ind];
    }
    </script>
</head>
<body>
<table>
<tr>
<td><p onmouseover="resim_degis(0)">Çicek</p></td>
<td rowspan="3"><img id="rsm" name="resim" src="http://www.bilisimogretmeni.com/images/cicek.jpg"/></td>
</tr>
<tr> <td><p onmouseover="resim_degis(1)">Dağ</p></td> </tr>
<tr> <td><p onmouseover="resim_degis(2)">Penguen</p></td> </tr>
</table>
</body>
</html>

[wp-js-fiddle url=”https://jsfiddle.net/BilisimOgretmeni/503xrpe4/” style=”width:100%; height:250px; border:solid #4173A0 1px;”]

Bu İçeriğe Tepkin Ne Oldu?
  • 4
    ba_ar_l_
    Başarılı
  • 0
    gayet_yi
    Gayet İyi
  • 0
    te_ekk_rler
    Teşekkürler
  • 1
    anlamad_m
    Anlamadım
  • 2
    yetersiz
    Yetersiz
Subscribe
Bildir
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Yorum
Inline Feedbacks
View all comments