Como logro este efecto?

[MasterXNicoX]

Hola, quería saber si alguien sabe como puedo
lograr el efecto de esta web que, al hacer clic en un enlace,
aparece la barra de scroll y la pantalla se desliza hasta llegar
a la sección elegida.

MADE BY SOFA

Ahí les dejo el enlace, espero que puedan ayudarme...
Prueben con el enlace de PEOPLE o PRODUCTS para
que entiendan de lo que hablo.

Dejo Karma a quien pueda ayudarme, un abrazo!!!

[JairLizcano]

Sinceramente no se aleja de darle el respectivo foco al contenedor que bien sea de People o Products después del previo evento click en el enlace predeterminado.

Las función para que documentes es focus() y la propiedad onclick de los elementos HTML gracias a JavaScript.

Ya bien el contenido dinámico de cada contenedor (o el mismo) lo podría peticionar con AJAX.

Buena suerte.

[MasterXNicoX]

Gracias por la info compi, me pondré a investigar!!
Si puedes o alguien puede darme info más específica estaré agradecido.
Por mientras, te dejo el karma prometido!

[JairLizcano]

En conclusión la función focus según tu caso te permite generar ese breve movimiento del scrollbar para ubicarte en el contenido que indiques, por ejemplo:

Foco a sección de id products

Código:

function toFocus() {

     var products = document.getElementById('products');
     products.focus();
}

Y bien sobre el enlace PRODUCTS, por ejemplo, indicar en el evento onclick (evento generado al hacer click sobre un determinado elemento HTML) la petición (implementando AJAX) de la sección de PRODUCTS y con la función JS que te indiqué anteriormente darle el foco a dicha sección.

Si tienes más dudas, sólo me indicas.

Buena suerte.

[MasterXNicoX]

Tengo todo claro con las funciones de JavaScript y del evento onclick,
y de cómo implementar dicha función en un enlace de mi HTML.

Ahora, con AJAX no sé como manejarme, nunca lo usé...

Qué me recomiendas hacer/leer para poder llevar a cabo
lo que ando buscando?... Respecto a AJAX, claro.

[JairLizcano]

Antes de que empieces a mirar alternativas diferentes a las funciones predeterminadas que nos ofrece JS, te recomiendo:

Documentación: http://www.librosweb.es/ajax/index.html

La idea es de que primero te hagas la idea de cómo funciona, qué puedes hacer y qué no.

Cualquier duda, estamos para ayudarnos.

Buena suerte.