Awesome jQuery Plugins For Creating Single-Page Websites
For websites with less content or to simplify the browsing experience, single-page websites are a great option.
Although they are used for any type of content, they are preferred mostly for portfolio, event and app (usually mobile app) ones.
Such websites can be enriched in different ways by a chic scrolling effect, modal boxes, tooltips, etc.
As a fan of single-page websites, here are the awesome jQuery plugins I use regularly (and some alternatives) to create them:
That's a very original plugin which allows us to draw a totally custom scroll path (with curves) of any size.
HTML elements can be placed along the path and events like mousewheel, up/down arrow keys or spacebar will get you to the next element with an animation that follows the path.
An optional custom scrollbar is included which allows click and drag scrolling. Also, the plugin allows rotating the entire page using CSS transforms.
This jQuery plugin enables us to locate content blocks into any coordinates of a canvas and browse them with the keyboard.
The sections are browsed like an elevator system which can go up/down and right/left.
Curtain.js can display multiple fixed panels with a curtain-rise effect which is great for creating a nice scroll effect.
It is also possible to use the keyboard or mousewheel for scrolling.
Zoomooz is actually a zooming plugin, however, it can be easily used to focus on different sections in a single page.
This jQuery plugin is specifically created for single-page websites.
It works by creating the contents of each menu as separate HTML files and loads those HTML files inside a defined
<div> once a menu item is clicked.
A plugin which can scroll to the given links with a nice easing animation.
It has the ability to block the hash change in the address bar and the speed of the animation can be customized.
JustaPage is more than a plugin but a template for designing one-page websites.
The template works cross-browser and it is mobile-friendly.
Also, in order to display more content in single page websites, lightbox/modalbox and tooltip solutions can help a lot.
- ColorBox: Highly-Customizable jQuery Lightbox
- Flexible Modal Windows With jQuery Superbox!
- leanModal – A Micro jQuery Modal Plugin
- Responsive Lightbox With jQuery UI – rlightbox
- An Advanced jQuery Tooltip Plugin – qTip2
- Bubble-Shaped Tooltips With jQuery: Grumble.js
- Tooltipsy – jQuery Tooltips For Control Freaks
If you make use of any other jQuery plugins for building single-page websites, please share them in the comments.