jQuery Scroll to Slide plugin (As in Nexus 5 website)

Heyy people,

So today morning we had a little network jam at workplace, which means free time :D And I was asked to make this certain plugin for so long, that i thought i would do it today. If you dont know what this is already, check Official Nexus 5 Site. You'll find a slider under the 'photography' section. It behaves like this,

Slider Features

1. Slides images up/down when you scroll with the mouse pointer inside the slider container (Phone in the above case)
2. If it's the last image or the first image of the slider, the normal sliding of the site happens.

Well, it's extremely easy to replicate this behavior, with around 15 minutes of work
We have a css file, JS file and a html file in my demo

Download Source : https://github.com/ManZzup/scroll-to-slide

Logic

What we need is to scroll a set of images up and down. Easiest way to achieve this is to position all the images one under the other, and then move the whole set of images by the amount of height of its container

scrollToSlide.css



scrollToSlide.js


index.html


Isn't much of a tutorial, but I thought would help someone. Ill be adding this to ma git repos soon, so you can always catch the latest release there :)

Cyah folks

EDIT:
I just found out the fiddles :D [not really]
check out the working demo