İlginizi Çekebilir
  1. Ana Sayfa
  2. Javascript
  3. JavaScript Örnekleri – Fare Yazının Üzerine Gelince Değişen Resim

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

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;”]

Yorum Yap

Kimler Neler Demiş?

Bir Cevap Yazın

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

  Subscribe  
Bildir