JQUERY - Simple smooth scrolling effect

Jquery smooth-scrolling.js

// Simple smooth-scrolling effect in Jquery

$('#links li').click(function(){  
    var liIndex = $(this).index();
    var contentPosTop = $('.content').eq(liIndex).position().top;
  
    $('html, body').stop().animate({
        scrollTop: contentPosTop // can add subtract numbers here for the exact position I want
    }, 1500);
});

// http://jsbin.com/inixoz/2/edit for more details

// here's some of the mark up 

<div id="links">  
  <ul>
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
  </ul>  
</div>

<div class="content">
  <h2>A</h2>
  Lorem ipsum dolor sit amet,
</div>
<div class="content">
  <h2>B</h2>
  Lorem ipsum dolor sit amet,
</div>

// usw

// basically it matches the order of the li with the order of the div, and that's how it works