Javascript – Dikdörtgen Çizme

Web Tasarım ve Programlama

Dosyayı indirmek için tıklayınız.

<head>
	<title></title>
	<style type="text/css">
		#kutu{
			width: 100px;
			height: 100px;
			border-style: solid;
			border-color: black;
			display: none;
		}
	</style>
</head>
<body>
	<script type="text/javascript">
		
		function ciz() {
		var ukenar,kkenar,renk;
		ukenar = document.getElementById("ukenar").value;
		kkenar=  document.getElementById("kkenar").value;
		renk =	 document.getElementById("renk").value;
 				 document.getElementById("dikdortgen").style.display = "block";
  				 document.getElementById("dikdortgen").style.height = kkenar+"px";
  				 document.getElementById("dikdortgen").style.width = ukenar+"px";
   				 document.getElementById("dikdortgen").style.backgroundColor = renk;
		}
	</script>
Uzun Kenar<input type="text" id="ukenar"  onmouseout="ciz()">
Kısa Kenar<input type="text" id="kkenar"  onmouseout="ciz()">
Zemin Rengi<input type="color" id="renk"   onmouseout="ciz()">
<div id="dikdortgen"></div>

</body>

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir