<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> New Document </title>  
  <style>  button { width:100px; height:30px; } </style>
  <script>
	var button1; //전역변수 선언
	var count=0;
	window.onload=function(){
		button1=document.getElementById("button1"); //초기화	
		button2=document.getElementById("button2"); //초기화
		
		m=function makeImg(){
			count++;
			img=document.createElement("img");
			img.src="http://cdn.redmondpie.com/wp-content/uploads/2011/05/Angry-Birds.png"
			img.width="100"; img.height="100";
			document.body.appendChild(img);
			if(count>10){ //10번 이상 실행하면 
				clearInterval(auto);
			}
		}		
		t=function(){
			setTimeout(m,500);	//0.5초뒤 m을 실행해라
			auto=setInterval(m, 200); //1초마다 m을 실행해라
		}  //10번 실행하면 멈추도록 만들어 보세요

		button1.onclick=t; //클릭하면 t 실행해라 
		button2.onclick=function(){
			clearInterval(auto);
		}

	}

  </script>
 </head>

 <body>
	<button id="button1" > click!! </button>
	<button id="button2" > stop !!</button>
 </body>
</html>



'JavaScript' 카테고리의 다른 글

draw  (0) 2012.06.12
버튼클릭시 순서대로 숫자 호출  (0) 2012.06.12
이미지 노드를 만들어서 화면아래에 추가  (0) 2012.06.12
이미지 변환  (0) 2012.06.12
배경 색 바꾸기  (0) 2012.06.12

+ Recent posts