DIV auto scroll

I'm have 2 DIVs (1 and 2) both are 100% width, 100% height and position:absolute, what i'm trying to achieve is when user viewing DIV 1 and scroll about 10% down, DIV 2 automatically scroll to fit the screen.

by Gopinath Kaliappan

HTML

<body>

<div id="one" class="content">
when user scroll like 10% down. the screen automatically scroll to the next div.
</div>

<div id="two" class="content">
this is second screen
</div>

</body>

CSS

@keyframes mymove {
    from {top: 0%;}
    to {top: 100%;}
}

.content{
  animation: mymove 2s;
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
}

#one{
	background:blue;
}

#two{
	top:100%;
	background:rgba(255,255,0,1.00);
}