Desplácese suavemente a un elemento específico en la página
Quiero tener 4 botones / enlaces en el comienzo de la página, y debajo de ellos el contenido.
En los botones pongo este código:
<a href="#idElement1">Scroll to element 1</a>
<a href="#idElement2">Scroll to element 2</a>
<a href="#idElement3">Scroll to element 3</a>
<a href="#idElement4">Scroll to element 4</a>
Y bajo los enlaces habrá contenido:
<h2 id="idElement1">Element1</h2>
content....
<h2 id="idElement2">Element2</h2>
content....
<h2 id="idElement3">Element3</h2>
content....
<h2 id="idElement4">Element4</h2>
content....
Está funcionando ahora, pero no puede hacer que se vea más suave.
Utilicé este código, pero no puedo hacerlo funcionar.
$('html, body').animate({
scrollTop: $("#elementID").offset().top
}, 2000);
¿Alguna sugerencia? Gracias.
Edición: y el violín:http://jsfiddle.net/WxJLx/2/