Welcome to My Blog 👋

Javascript ve HTML5 ile güvenlik resmi uygulaması

Örnek:

HTML Dosyası

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Güvenlik Resmi Uygulaması</title>
<script type="text/javascript">
var ctx;
var init = function(){
ctx = document.getElementById("c").getContext("2d");
ctx.fillStyle = "#bbeeff";
degistir();
}
var degistir = function(){
var key = "";
for(var i = 0;i<6;i++){
var rnd = Math.random();
if(Math.round(rnd) == 0){
key += String.fromCharCode(48+9*Math.random());
}
else{
key += String.fromCharCode(65+25*Math.random());
}
}
ctx.clearRect(0,0,150,50);
ctx.fillRect(0,0,150,50);
ctx.font="30px calibri";
ctx.strokeText(key,24,34);
}
</script>
</head>
<body onLoad="init();">
Güvenlik Resmi:<br />
    <canvas id="c" width="150" height="50"></canvas><br />
        <input type="button" value="Değiştir" onClick="degistir();">
</body>
</html>

Javascript ile zamanlayıcı örneği

Örnek:

HTML Dosyası

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Javascript Zamanlayıcı Örneği</title>
<style type="text/css">
#main{
border-style:solid;
width:100px;
height:100px;
font-size:70px;
text-align:center;
}
</style>
<script type="text/javascript">
var zamanSayac = 0;
var zaman;
function say(){
document.getElementById("main").textContent = zamanSayac;
zamanSayac++;
}
function baslat(){
zaman = window.setInterval("say()",1000);
document.getElementById("buttonBaslat").disabled = true;
document.getElementById("buttonBaslat").value = "Devat Et";
document.getElementById("buttonDurdur").disabled = false;
}
function durdur(){
document.getElementById("buttonBaslat").disabled = false;
document.getElementById("buttonDurdur").disabled = true;
window.clearInterval(zaman);
}
function init(){
document.getElementById("buttonBaslat").disabled = false;
document.getElementById("buttonDurdur").disabled = false;
}
</script>
</head>
<body onLoad="init();">
<div id="main"></div><br />
<input type="button" id="buttonBaslat" value="Baslat" onClick="baslat();" />
    <input type="button" id="buttonDurdur" value="Durdur" onClick="durdur();" />
</body>
</html>