jquery etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
jquery etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

28 Mart 2012 Çarşamba

Her açılışta farklı resim

Sayfanın istediğimiz bir yerindeki resmin her açılışta farklı gelmesini istiyorsa işte kodları:

bir klasöre çıkmasını istediğimiz resimleri koyuyoruz. daha sonra resimlerin çıkacağı yeri şu şekilde kodluyoruz.

<img src="resim/" alt="Resim" name="RandomImg"/>

daha sonra

</body>

tagının hemen üzerinede:

    <script type="text/javascript" language="javascript">
        var rand_no = Math.floor(3 * Math.random());
        
        document.images['RandomImg'].src = "resim/" + rand_no + ".jpg";
    </script>

bu kodları yerleştiriyoruz.


Burada dikkat edilmesi gereken tek şey resimlerin isimleri. Resim isimlerini 0.jpg den başlayarak 1.jpg, 2.jpg şeklinde yapın. Çünkü javascript random sayı üretmeye 0' dan başlar.

İşlem bu kadar...

Ben 3 resimli bir örnek yaptım bu örneği geliştirip kendi yapılarınız da kullanabilirsiniz.

Dosyayı indirmek için buraya tıklayın

Her açılışta değişen background resimleri için Buraya tıklayınız

Değişen Background Image

Bunu yapmanın en basit ve pratik yolu şu java script kullanmaktır.

Önce bir klasöre değişmesini istediğimiz resimler konulur. Daha sonra resimlerin değişmesini istediğimiz sayfaların  tagından önce



<script language="JavaScript">

function bgdegis();{
kacresim=10;
sayi=Math.round(Math.random()*kacresim);
document.body.style.backroundImage ="url(\"resim yolu"+sayi+".jpg\")";
}
</script>


Klasöre atacağınız resimlere numara vermelisiniz örneğin 1.jpg , 2.jpg 3.jpg gibi. Çünkü sistem esasında rastgele bir sayı üretip o üretilen sayıyı klasörde aramaktadır.

bu işlemi yaptıktan sonra body tagını aşağıdaki gibi düzeltiyoruz.

<body onload="bgdegis()">

İşlem bu kadar.


Dosyayı indirmek için buraya tıklayın