Üçgenin Alanını Hesaplama
[Basit]
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <input type="text" id="kenar1" placeholder="Taban Uzunluğunu Girin"> <input type="text" id="kenar2" placeholder="Yüksekliği Girin"> <input type="button" value="Hesapla" id="hesapla" onclick="hesapla()"> <script> function hesapla(){ //text kutusu içindeki değerleri okuyup sayi1,sayi2 değişkenine aktarıyoruz. var sayi1=document.getElementById("kenar1").value; var sayi2=document.getElementById("kenar2").value; //text kutusuna girilen değerler metinsel türdedir. Hesaplama yapabilmek için sayıya çeviriyoruz. sayi1=Number(sayi1); sayi2=Number(sayi2); var alan=sayi1*sayi2/2; alert("Üçgenin alanı:"+alan); } </script> |
JavaScript: Farenin Konumunu Öğrenme
[Orta]
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | <!doctype html> <html> <head> <meta charset="utf-8"> <title>UMUT YURDUGUL CODE </title> </head> <style> .konum{ width: 250px; height: 50px; line-height: 50px; font-size: 2em; background: #64DDBB; color:#D33257; padding:5px; margin:5px; } #kutu{ /* ÖNEMLİ NOT: HAREKET ETTİRİLECEK NESNENİN POZİSYON DEĞERİ ABSOLUTE OLMAK ZORUNDA!!!*/ position: absolute; width: 100px; height: 100px; background: #FF7416; } </style> <body> <div id="x" class="konum">X</div> <div id="y" class="konum">Y</div> <div id="kutu"></div> </body> <script> //window (taraycı penceresi) üzerinde fare hareket ettirildikçe çalışacak kodlar window.onmousemove=function(olay) { //gerçekleşen olayla ilgili tüm bilgi olay değişkenine aktarılıyor. var xpos=document.getElementById('x'); var ypos=document.getElementById('y'); var kutu=document.getElementById('kutu'); //clientX: farenin x eksenindeki konumu //clientY farenin y eksenindeki konumu xpos.innerHTML=olay.clientX; ypos.innerHTML=olay.clientY; //ÖNEMLİ NOT: HAREKET ETTİRİLECEK NESNENİN POZİSYON DEĞERİ ABSOLUTE OLMAK ZORUNDA!!! kutu.style.left=olay.clientX+"px"; kutu.style.top=olay.clientY+"px"; } </script> </html> |
Yorumlar
Yorum Gönder