Closed

Parallax Site with Horizontal to Vertical Scroll

This project received 9 bids from talented freelancers with an average bid price of $448 USD.

Get free quotes for a project like this
Employer working
Project Budget
N/A
Total Bids
9
Project Description

Hello,

I'm trying to create a parallax site, but with a very unique twist.

I currently have HTML and CSS for a horizontally scrolling parallax site. However, I would like it so when you get to a specific section you're given a vertical parallax scroll instead of a horizontal one.

Check out this site for an example: [url removed, login to view] ...you'll see how the horizontal scroll, all of a sudden becomes a vertical scroll...

One important requirement, is that you MUST continue using Stellar JS (linked below)...

Another important requirement, I'd like to have movement on the site controlled in three ways:

1) The Mouse Wheel...in both horizontal and vertical modes.

2) Edge Scrolling --keeping your mouse to the right hand side of the viewport will pan the scene to the right (as if you're scrolling). Also keep in mind that you'll need to be able to do this vertically during that portion of the site. Check out ([url removed, login to view])

3) Scroll Bar ...I'll also need a horizontal scroll bar as well. Keep in mind that this will need to become a vertical scroll bar during the vertical scene at the end.
It would be strongly preferred if you used something like NiecScroll ([url removed, login to view]) or something similar to allow for "smooth" scrolling on the page, no matter the control method.

REQUIREMENTS

1) Ability to switch from horizontal parallax, to vertical parallax at the end of a "scene", within the main container.

2) Use of [url removed, login to view] ([url removed, login to view])

3) Three Control Methods: Mouse Wheel, Edge Scrolling (only when on to the right side of the main container), and Scroll Bar ...all of these should all work for Horizontal and Vertical Scenes.

4) Use of something similar to NiceScroll to allow for a "smooth" scrolling effect.

5) Code with comments is strongly preferred.

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online