Skip to content

Instantly share code, notes, and snippets.

@ahmeturganci
Created November 10, 2018 22:02
Show Gist options
  • Select an option

  • Save ahmeturganci/ada637180e2e8c31c9646c4ed668ebcb to your computer and use it in GitHub Desktop.

Select an option

Save ahmeturganci/ada637180e2e8c31c9646c4ed668ebcb to your computer and use it in GitHub Desktop.
For helping murat app
<!DOCTYPE html>
<html>
<style>
#container{
display: flex;
flex-direction: row;
background-color: antiquewhite;
}
</style>
<body>
<h2>Text-Div Js Exam Preparing</h2>
<p>Verileri eksiksiz giriniz!</p>
<div class="form">
<span>Renk Giriniz!</span>
<input type="text" id="txtp1" class="input" />
<span>Kaç Adet Kutu Olacak!</span>
<input type="number" id="txtp2" class="input" />
<button onclick="KutuOlustur();">Hesapla</button>
</div>
<div id="container">
</div>
<script>
function KutuOlustur() {
var renk = document.getElementById("txtp1").value;
var kutuSayisi = document.getElementById("txtp2").value;
for (var i = 1; i <= kutuSayisi; i++) {
//document.write("<div style='font-size:1rem;background-color:"+renk+";width: 1rem;height: 1rem; margin:0.1rem'> "+i+" </div>");
// var div = ("<div style='font-size:1rem;background-color:"+renk+";width: 1rem;height: 1rem; margin:0.1rem'> "+i+" </div>");
var objTo = document.getElementById('container')
var divtest = document.createElement("div");
divtest.innerHTML = "<div style='text-align:center; font-size:3rem;background-color:" + renk + ";width: 3rem;height: 3rem; margin:0.5rem; padding:0.5rem;'> " + i + " </div>";
objTo.appendChild(divtest);
// sonuc.appendChild("<div style='font-size:1rem;background-color:"+renk+";width: 2rem;height: 2rem; margin:0.1rem'> "+i+" </div>");
}
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment