how to do a smooth scroll down a page with javascript -

function scrollwin() {      setinterval(function(){ for(var = 0; < 1250; i++){      window.scrollto(0, i);} }, 3);        }

li {    float: left;    list-style: none;    margin: 10px;  }  .reset {    clear: both;  }  div {    width: 500px;    height: 600px;    background-color: blue;    margin: 20px;  }

<ul>    <li><a href="#"></a>home</li>    <li><button onclick="scrollwin()"></a>about</button>        <li><a href="#"></a>profile</li>    <li><a href="#"></a>contact</li>  </ul>  <div class="reset"></div>  <section>    <div id="home1"></div>    <div id="about1">about</div>    <div id="profile1"></div>    <div id="contact"></div>  </section>

so im trying make loop increase height 1 each loop make screen drop height of one. using time interval short amount of time believe make smooth scroll down page.

i'm writing sample code in php scroll bar appears if loop run second time in question asked hope. define variable first , increase in loop follows:

<?php $i=1; for(condition;condition;condition){      //your code here      $i++; }  if($i<1){  echo '<script>          $(".yourdivclass").css("overflow","scroll");        </script>'; } ?>