Single Page Starter
Because the world needs yet another one!

The perfect starter for a responsive single page website

View on GitHub

Components

Smooth Scrolling

A very lightweight and easy to use jQuery plugin that allows anchors that refer to elements in the same page to scroll smoothly with animation and flexibility in speed also

Examples

Go to "Home" quickly

Go to "Credits" but not in a hurry !

Implementation

All you have to do is include two data attributes in the desired anchor, "data-id" and "data-speed" while the speed is optional, the id has to be equal to the element ID that you want to scroll to, read on GitHub for more info.

Grid System

The grid is very flexible, it provides Four breakpoints, Source Ordering, Offsets, Centering, read more on GitHub and view the examples.

11
1
10
2
9
3
8
4
7
5
6
6

Buttons

Primary Alert Secondary Success
Large Small Large Expand

Panels

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem, eum, et quam in quis maiores ipsam debitis aliquid quaerat quia eos ad id nulla impedit doloribus ab repudiandae sequi ullam.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem, eum, et quam in quis maiores ipsam debitis aliquid quaerat quia eos ad id nulla impedit doloribus ab repudiandae sequi ullam.

Forms

Why another starter template/skeleton?

That's actually a very good question, it's the one that I started asking for myself when creating this Skeleton.

Well, as you might know by now that single page websites are very trendy and used very often, the need to a lightweight yet powerful skeleton without having to include all the features of a fully fledged framework like Foundation or Bootstrap became essential

Also a very key feature is smooth scrolling and navigation through this one page website, it was a pain in the ass to use some of the plugins out there so I've decided to create one of my own that simplifies the process and allows ease of use across the document

Finally there is no need to say how important responsive web design is, so you now can use a very powerful/customisable/flexible responsive grid without having to integrate a large framework

Give credits when credits are due

As small as this project may seem it actually involved a lot of other awesome developers' code, so let's list them

singlePageSkeleton$ ls -a

This project is brought to you by Zyad Sherif

Follow on Twitter View Portolfio