Javascript – Zar Atma Örneği
zar_atma uygulama dosyası için ztıklayınız …
Bu uygulamanın gerçekleştirilmesi için bilinmesi gerekenler,
var d1 = Math.floor(Math.random() * 6) + 1;
Math.floor : sayıyı yuvarlatmak amacıyla kullanılmaktadır. Bu fonksiyon içinde olan sayıyıy yuvarlar.
Math.random() : 0-1 arası rastgele bir sayı bulur.
1-6 arası rastgele sayı bulmak için ilgili yapı Math.floor(Math.random()*6)+1
“+1 yapılmamış olsaydı. 0-5 arası yapılmış olacaktır.
<style> #resim{ float: left; width: 32px; height: 32px; } div.zar{ float:left; width:32px; background:#F5F5F5; border:#999 1px solid; padding:10px; font-size:24px; text-align:center; margin:5px; } </style> <script> function ZarAt(){ // rast gele sayı var d1 = Math.floor(Math.random() * 6) + 1; var d2 = Math.floor(Math.random() * 6) + 1; // sayıyı sayfaya yaz var zar1 = document.getElementById("zar1").innerHTML= d1; var zar2 = document.getElementById("zar2").innerHTML = d2; // resmini goster document.getElementById("resim").innerHTML = "<img class=rsm1 src="+d1+".gif>"; //""; document.getElementById("resim2").innerHTML = "<img class=rsm2 src="+d2+".gif>"; } </script> <style type="text/css"> .rsm1{float: left;width: 50px;height: 50px;margin: 0px;padding: 0px;margin-left: 5px;} .rsm2{float: left;width: 50px;height: 50px;margin: 0px;padding: 0px;margin-left: 40px;} #content{margin-left: 50%;} #sekkilzar{width: 250px;height: 250px;margin-left: -200px;margin-top: 100px; } </style> </head> <body> <div id="content"> <img src="" class="rsm"> <div id="zar1" class="zar">0</div> <div id="zar2" class="zar">0</div><br><br><br><br> <button onclick="ZarAt()">Zar At</button><br><br><br> <div id="resim"> </div> <div id="resim2"> </div> </div> </body>