About This Course
Create your own Single Page Scrolling Website from Scratch. Single page websites are extremely popular, in this course we show you how to build one from scratch. All the source files and resource links are included, so you too can build your own website by the end of this course.
With over 14 years experience in web development, I’ll introduce you to website design, explained step by step.
Starting with a setup of a basic HTML5 web template. Next, we add some content and create a shell to build the one page website on.
Next, we bring the content to life using CSS3. Styling turns the HTML code into a styled webpage.
JavaScript and jQuery are then used to create amazing scrolling effects. Using data from the DOM, and properly calculating the section sizes we show you how to create page scrolling with jQuery.
All the source files and resources are included so you can get started quickly.
Bonus content – update the code to create a fully functional website. Expand your portfolio and practice website design. We turn the previous menu into a fully functional sticky header menu. Add images and colors to create the sample website, ready for the real world. Make it responsive and have it re-size and expand to fit any screen.
- Learn to create a contact form
- learn how to apply JQUERY with HTML and CSS
- Access and interact with the Document Object Model DOM
- add Bootstrap for styling
- use Awesome fonts for cool fonts
Learn to Create your own website in easy to follow steps. Let’s get started creating amazing websites!
Our Promise to You
By the end of this course, you will be able to learn how to create your own amazing single page website.
30 Day Money Back Guarantee. If you are unsatisfied for any reason, simply contact us and we’ll give you a full refund. No questions asked.
Get started today and develop your skills in creating single page websites!
Course Curriculum
Section 1 - How To Build A One Page Scrolling Website From Scratch | |||
HTML5 CSS3 Course Introduction | 00:00:00 | ||
HTML5 Single Page Website Resources | 00:00:00 | ||
Course Resources | 00:00:00 | ||
HTML5 Webpage Setup Code | 00:00:00 | ||
HTML5 Add HTML Coding | 00:00:00 | ||
HTML Add Dummy Text And Images | 00:00:00 | ||
HTML5 Website Anchor Links | 00:00:00 | ||
HTML5 Setup CSS | 00:00:00 | ||
HTML5 Sticky Navigation Menu | 00:00:00 | ||
HTML5 Add Navigation Menu | 00:00:00 | ||
JavaScript Setup HTML5 Website | 00:00:00 | ||
JQUERY Selector Click Menu Setup | 00:00:00 | ||
JQUERY Add Remove Classes | 00:00:00 | ||
How To Use jQuery To Scroll Your Webpage | 00:00:00 | ||
jQuery Scrolling Options | 00:00:00 | ||
jQuery Scroll Position Conditions And Calculations | 00:00:00 | ||
Completed Navigation One Page Website Scroll Automation | 00:00:00 | ||
Source Code For One Page Website Basic Template | 00:00:00 | ||
Section 2 - One Page Website Bonus Code Customization And Tweaks | |||
CSS Create Sticky Top Nav Menu | 00:00:00 | ||
Position Add Spacing For Navigation Menu | 00:00:00 | ||
Navigation Styling Nav Bar | 00:00:00 | ||
Style Nav Menu CSS | 00:00:00 | ||
Add Images And Colors To Sections | 00:00:00 | ||
HTML5 Website Creation | 00:00:00 | ||
CSS3 Styling Of Content | 00:00:00 | ||
Create A Contact Form For The Website | 00:00:00 | ||
Make It Responsive | 00:00:00 | ||
Completed Project 1 Page Responsive Website Template | 00:00:00 | ||
Source Code HTML5 Index File | 00:00:00 | ||
Source Code CSS3 Style File | 00:00:00 | ||
Source Code JavaScript jQuery Script File | 00:00:00 | ||
Section 3 - Updates For Website Code | |||
Source Code Updated Using Window Scroll | 00:00:00 |