html - I need javascript for animation to start when div# comes into viewport -

i want use draw animation on 1 page website, want animation start when scroll div# not on document ready.

var svg = new walkway({      selector: "#capa_1",      duration: 6000  }).draw();      var svg = new walkway({      selector: "#capa_2",      duration: 6000  }).draw();

     	path, line, polyline {  	    stroke: #fff;  	    stroke-width: 2px;      }        path {  	    fill: transparent;      }

<div class="main">  		<div id="one" class="left">  			<svg version="1.1" id="capa_1"> </svg>  		</div>  		<div id="two" class="right">  			<svg version="1.1" id="capa_2"></svg>  		</div>  	</div>

something should enough

https://jsfiddle.net/patrik/89n0h7c3/

var height = window.innerheight; var el = document.getelementbyid('animation'); var bounds = el.getboundingclientrect();  function draw() {   if (window.scrolly + innerheight >= bounds.top) {     el.classlist.add('animate');   } }  window.addeventlistener('scroll', function () {   draw(); });   // try draw on refresh draw();