Búsqueda de sitios web

javascript - Desplazamiento vertical suave de la página usando la rueda del ratón y la barra de desplazamiento

Estoy jugando y tratando de construir un sitio web con efecto parallax; sí, sé que son una moda molesta, pero aún así me gustaría intentarlo. Entonces, para inspirarme, he estado viendo varios ejemplos de buenos sitios web con parallax y me encontré con este: https://victoriabeckham.landrover.com/INT.

Tiene desplazamiento suave usando la rueda del ratón, la barra de desplazamiento y los enlaces de anclaje. He estado buscando plugins de jQuery que logren este efecto, pero solo parece que encuentro aquellos que usan enlaces internos de la página: anclajes o ID (detallado más abajo), pero no la rueda del ratón ni la barra de desplazamiento. Hay una buena probabilidad de que esté buscando usando las palabras clave incorrectas. ¿Alguien conoce la terminología correcta para encontrar estos plugins o conoce algún plugin que logre este efecto?

Como nota al margen, actualmente estoy aprendiendo jQuery y Javascript, pero estoy en las primeras etapas: todavía estoy navegando por Codeacademy y no he llegado a ningún código del mundo real aún. Así que, por el momento, estoy jugando con plugins como una forma de aprender, ¡pero espero que en unos meses pueda crear mis propias cosas!

Desplazamiento suave a etiquetas de anclaje o ID:

  • http://archive.plugins.jquery.com/project/ScrollTo
  • http://jsfiddle.net/9Amdx/7/
  • http://arthurclemens.github.com/jquery-page-scroll-plugin/
  • http://www.learningjquery.com/2007/09/animated-scrolling-with-jquery-12
  • http://www.designova.net/scrollerbird/
  • http://chris-spittles.co.uk/?p=462
  • http://joelb.me/scrollpath/ (*cortesía de @DrunkRocketeer)

Y, otro ejemplo de un sitio web con efecto de paralaje utilizando una técnica similar para el desplazamiento:

  • http://www.ascensionlatorre.com

Respuesta #1

Prueba este. https://nicescroll.areaaperta.com/

Tiene

$().scrollTop()

También un listener de eventos de jQuery para que puedas tener la ruta de desplazamiento configurada con el script de paralaje.

Respuesta #2

Creo que tienes que combinar varios de estos efectos para hacer algo que se parezca al sitio de Landrover. Un script de desplazamiento suave, un script de ruta de desplazamiento y un script de paralaje.

Este es un sitio interesante para el elemento path de ese sitio web: http://joelb.me/scrollpath/

¡Aunque la mejor manera de descubrir cómo funcionan estos sitios es examinarlos! Algunos sitios geniales que usan paralaje: http://www.awwwards.com/?s=parallax&post_type=all&search=Ok

¡Espero que esto haya sido de alguna ayuda/inspiración!