Test code

On 30th June, I have done some of code research for my portfolio in this CFE project. Among some other research, I have found this is more suitable to apply in my project. This website has also provide tutorials file, so that I can refer to the codes and use it to develop further in this portfolio. 

In my portfolio, I wanted it to be a parallax in horizontal website, whereas when user click on the menu, it will slides up and shows buttons. When user click on the one of the buttons it will slide to the specific page.

First of all, I wanted my menu on the bottom of my webpage. However I wanted it to be always stick to the bottom no matter how I zoom in and out, display it into another browser it still stick at the bottom. Therefore I found a tutorial through online. 

Link : http://jsbin.com/aloqad/2/edit
This tutorial is simple and easy to understand. Therefore, by following the codes, I have done my menu bar which it is stick to the bottom.

By referring to the Scrolling cloud reference, I have also done my parallax horizontal with page of 6. For example, when user click on box 3 buttons in the menu bar, the page will auto scroll to the page 3 content page.

Next is I will be doing the menu to slide up when user click on the little triangle. May refer to the sketches bellow. 

When user click on the triangle, menu bar will sliding up for user to choose which page they want to go. Menu buttons will place in a slanting 45 degree position.

From the sketches, when user mouse over the buttons, it will stands out among the others whereas the others buttons will seems to blur out. When user mouse out, the buttons turns to original. To be more clear on what my explanation. This is an example and tutorials that I would like to achieve.

 When mouse out.

Mouse over on one button.

Link: http://tympanus.net/Tutorials/BlurMenu/index2.html

However, before execute in that area. I have tried out some of the codes for sliding up the menu bar but failed. 

When I mouse over the box it doesn't move upwards smoothly but it suddenly jump on the top. I will further examination in this part until I get my result. I also looking for some of the research that could helps me in this part.