javascript - Smidig vertikal sidscrollning med mushjul och rullningslist

Jag leker runt och försöker bygga en parallaxwebbplats - ja, jag vet att de är en irriterande trend men jag skulle ändå vilja prova. Så, för inspiration har jag tittat på olika exempel på bra parallaxwebbplatser och stötte på denna: https://victoriabeckham.landrover.com/INT.

Den har smidig rullning med mushjulet, rullningslisten och ankarlänkar. Jag har letat efter jQuery-plugins som skulle uppnå denna effekt men kan bara hitta sådana som använder interna sidor länkar - ankare eller ID:n (beskrivs nedan) - men inte mushjulet och rullningslisten. Det finns en god chans att jag söker med fel nyckelord. Vet någon den korrekta terminologin för att hitta dessa plugins eller känner till några plugins som skulle uppnå denna effekt?

Förresten, jag lär mig för närvarande jQuery och Javascript men är fortfarande i de mycket tidiga stadierna - håller fortfarande på att gå igenom codeacademy och har ännu inte arbetat med någon verklig kod. Så just nu leker jag med plugins som ett sätt att lära mig, men förhoppningsvis kan jag om några månader bygga mina egna saker!

Smidig rullning till ankartaggar eller ID:n:

  • 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/ (*med tillstånd av @DrunkRocketeer)

Och ett annat exempel på en parallax-webbplats som använder en liknande teknik för scrollning:

  • http://www.ascensionlatorre.com

Svar #1

Prova den här. https://nicescroll.areaaperta.com/

Det har fått

$().scrollTop()

jQuery-händelselyssnare också så att du kan ha rullningsväg konfigurerad med parallax-skript.

Svar #2

Jag tror att du måste kombinera flera av dessa effekter för att skapa något som liknar Landrover-sajten. Ett script för smidig scrollning, ett script för scrollväg och ett parallax-script.

Detta är en intressant sida för sökvägselementet på den webbplatsen: http://joelb.me/scrollpath/

Även om det bästa sättet att ta reda på hur dessa sidor fungerar är att undersöka dem! Några coola sidor som använder parallax: http://www.awwwards.com/?s=parallax&post_type=all&search=Ok

Jag hoppas att detta var till viss hjälp/inspiration!