canvas 만들어보기_02/green 계열의 물방울 놀이

실험02_은하수 뇌구조에 적용

상단의 메뉴버튼 [학과사이트 / 모바일 / 정규식 / 비밀병기 / 용어설명.....] 및 모든 a 링크를 누르면 canvas 작동

//과장님 실험작 02 _ green 계열 물방울 놀이
$(function() {
	$('a').click(function(e){	
	$('body').append('')
	
	var canvas = document.getElementById("c");
	var context = canvas.getContext("2d");
	//var i=1;
	
	function draw(){
	    var topLeftCornerX = Math.floor(Math.random() * 1920);
	    var topLeftCornerY = Math.floor(Math.random() * 1000);
	    var width = Math.floor(Math.random() * 200);
	    var height = Math.floor(Math.random() * 200);
	    var red = Math.floor(Math.random() * 255);
	    var green = Math.floor(Math.random() * 155) + 100;
	    var blue = Math.floor(Math.random() * 255);
	 
	    context.beginPath();
	    context.arc(topLeftCornerX,topLeftCornerY, width, 0, 2*Math.PI, false);
	    context.fillStyle = 'rgba('+50+', '+green+', '+blue+', 0.2)';
	    context.fill();
	    context.lineWidth = 2;
	    context.strokeStyle = 'rgba('+50+', '+green+', '+blue+', 0.5)';
	    context.stroke();
	    context.fillStyle    = 'rgba('+50+', '+green+', '+blue+', 1)';
	    
	    // 방울방울속에 숫자를 없애고 싶어요? 아래애들을 가릴께요..	    
	    //	 context.font         = 'Italic 12px "malgun gothic"';
	    //	 context.textBaseline = 'Top';
	    //	 context.fillText  (i, topLeftCornerX-10, topLeftCornerY+5);
	    //	    i++
	}

	setInterval(draw, 1);

	});
});

[문제점]
새창으로 뜨는 이미지를 클릭했을때 parent 창에서 계속 거품이 부글부글, canvas가 멈추지 않는다.