You'll remember the 2 previously shared and popular resources for quickly developing websites: Twitter Bootstrap and Foundation.
Here is a powerful alternative named HTML KickStart which is a HTML5, CSS and jQuery-powered toolkit for easily creating any type of layouts with web elements in-rhythm.
It has styles for grids, typography, forms, buttons, tables or lists and cross-browser eb elements like a JavaScript gallery, lightbox, breadcrumb navigation, menus with sub-menus and more.
HTML KickStart is focused on providing a clean, standards-compliant and cross-browser mark-up (for HTML,CSS and JS).
The project is documented in detail, has examples for all elements and it is improved regularly.
Compatibility: All Modern Browsers
TextExt is a feature-rich jQuery plugin for improving the functionality of text input fields.
The plugin is modular, can be extended easily and has features like tag inputs, filtering, auto-complete, placeholder text and Ajax (which are all plugins of TextExt).
It can also display a custom arrow besides select fields, show the items in them as suggestions-while-typing and more.
TextExt is very well-documented, regularly improved and has too many examples to start with.
Requirements: jQuery
Compatibility: All Major Browsers
jQuery Rewritten, Ground-Up, for Mobile HTML5 on iOS and Android devices.
This is how jQ.Mobi defines itself and gives a good insight on what it is.
It is a fresh and open source JavaScript framework -developed by appMobi- that focuses on providing a great experience on both of the dominant mobile operating systems with a tiny footprint and code efficiency.
Compared to jQuery Mobile (24kb), it is much smaller in size with only 3.5kb (both minified and gzipped) and covers most features with the same syntax.
When it comes to speed, jQ.Mobi is impressive there as well and mentioned to be 3x faster on Android and 2.2x faster on iOS.
The framework also has a UI library (again smaller in size) and includes plugins for mobile interactions and interfaces
Requirements: No Requirements
Compatibility: WebKit Browsers
syze is a standalone and tiny (<1kb) JavaScript-library for targeting web page designs by device or browser size very easily to build responsive websites.
The library allows us to define any number of breakpoints (as widths) with a single function and sets the class of <body> automatically on "window resize" or "change in orientation".
There are functions provided for collecting device + browser sizes and setting a custom debounce rate for making sure that no serious CPU load is created for the user's computer when syze is active.
syze also has a callback fired afte each event which is great for adding custom events to the mix.
Requirements: No Requirements
Compatibility: All Major Browsers
FeedEk is a jQuery plugin for parsing and displaying RSS and Atom feeds.
The plugin is so easy to use and can grab the feed items from any domain with a few lines of code.
Just mention the feed URL, how many items to be displayed, description and publish date to be shown or not and that's all.
Requirements: jQuery
Compatibility: All Major Browsers
Loading screens are a part of almost any application (softwares, games, etc.) since forever.
We also see them in HTML5 apps informing us that the resources to be used for the application is being downloaded and the status of the overall progress.
PxLoader is a JavaScript library, that is built for the popular Cut The Rope game's HTML5 version, for downloading images, sound files or any other resource before any defined action (like activating the whole app).
It enables us to monitor download status with the help of progress + completed events and also lets us to prioritize the order in which items are downloaded.
Such features make PxLoader not only a library to manage the download of resources but also a good fit for creating visual preloaders for HTML5 apps.
Compatibility: All Modern Browsers
There are many beautiful content sliders out there which can be easily integrated into web pages where most of them come with a default design and functionality.
If you want to create a completely custom one, Revolver.js,a boilerplate for customizable sliders is a good fit.
Revolver.js is a jQuery and MooTools plugin with an API covering the most common slider functions.
Almost any markup can be used for sliders, their designs are under control with CSS and the API is flexible enough to manage it in any desired way.
There are various transitions types to choose from, functions exist for browsing items (first, last, next, etc.) and callbacks are offered for each event.
The resource is very easy-to-use, documented in detail and has a small footprint (~4.5kb minified).
Requirements: jQuery or MooTools
Compatibility: All Major Browsers
MASHA is a JavaScript utility that allows readers to highlight any parts of a web content and share it with others.
The feature is triggered when readers select any desired text and an icon appears to inform them about the feature + create a unique link when clicked.
Readers can simply click the icon, copy the unique URL generated and share it with others. When a MASHA-generated URL is loaded, the selected text is highlighted so that it is seen easily.
There are callbacks for onMark, onUnmark and onHashRead (when a MASHA URL is loaded) that makes custom events possible and a WordPress plugin exists for quickly adding this utility.
Requirements: No Requirements
Compatibility: All Major Browsers
Info: The demos of the resource don't work as the source video files are unavailable.
Acorn Media Player is a jQuery plugin for creating a customizable HTML5 media player with support for accessibility.
The player can be completely controlled with keyboard (with standard tab-based navigation), has screen-reader support + accessible themes and various other accessibility tweaks.
There is also support for closed captions and a dynamic transcript generated from the selected captions is provided.
Acorn Media Player can be themed with ease, can display videos in fullscreen, informs users on loading processes with loading + buffering indicators and can even remember the volume level used with HTML5 localStorage.
The sliders (seek and volume) can either use jQuery UI's widgets or a custom one is provided as well and few other options exist (like the direction of the volume slider) for further customization.
Requirements: jQuery
Scrollorama is a jQuery plugin for creating eye-candy effects in parallel to the scrolling of web pages.
By dividing the content into blocks, it simply lets us to animate elements on the page (when a block is reached) based on the browser window’s scroll position.
The animations are accomplished using CSS properties, durations of them can be defined and it is also possible to set the exact scrolling positions of the start/stop events.
Requirements: jQuery
Compatibility: All Modern Browsers
Thank you! Please check your inbox to confirm your subscription.
Loading...
Get WebResourcesDepot WeeklyA Weekly Newsletter For Web Designers And Developers
