<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
<script>
function a2b(){
var element = document.getElementById("b");
element.scrollIntoView({behavior: "smooth"});
}
function b2a(){
var element = document.getElementById("a");
element.scrollIntoView({behavior: "smooth"});
}
</script>
</head>
<body>
<h1>Hello Plunker!</h1>
<button id="a" onmouseover="a2b();">A to B</button>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<button id="b" onmouseover="b2a();">B to A</button>
</body>
</html>
// Code goes here
/* Styles go here */