GOOCODE - Find your code/scripts

7 How to create a just simply and none requiring javascript and CSS property of background-attachment can be realized fixed page backgrounds and scrolling effect. We see that there are many project sites use parallax effect, parallax is generated by the dynamic changes and the background image and js script, but today we only need CSS.

HTML structure is very simple, a background image is fixed placement class .cd-fixed-bg div element for a class of .cd-scrolling-bg div element portion for scrolling. We can place multiple .cd-fixed-bg and .cd-scrolling-bg group.

15 By clicking the menu on side of the page it is loaded along with the corresponding slide transition animations, but also with the progress bar effect. Of course, the page loaded is driven by Ajax, the entire loading process of transition is very smooth, with very good user experience.

HTML structure, .cd-main body of the page contains content, .cd-side-navigation contains the side navigation bar, # cd-loading-bar is used to make a progress bar with animation.

6 fakeLoader.js is a lightweight jQuery plugin which can help us to create a full-screen transition animations load, when the page is loaded, display the loading animation, when the content of the page finished loading animation disappears to display the page.

HTML
We only need to add the following code on the first line of the [body].