Connect With WRD
feed via e-mail
feed via e-mail

Archive for the ‘MIT License’ Category

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.

Revolver.js

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).

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.

Masha

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.

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 jQuery Media Player

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.

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.

Scrollorama

Few months ago, a WRD article: "9 Free JavaScript Libraries & Templates For Beautiful Web-Based Presentations" has shared great presentation engines built by web technologies.

A new presentation framework is released recently -named Impress.js- which enables us to build very beautiful outputs.

Slides can be by positioned, rotated and scaled on an infinite canvas with zoom in/out and 3D effects by making use of CSS3 transforms and transitions to create the awesomeness (which makes it only compatible with WebKit and the latest Firefox + IE browsers).

And, for older browsers, Impress.js fallbacks to a standard presentation without the effects but by keeping the functionality.

Impress.js

You'll remember Twitter Bootstrap, a toolkit by Twitter for kickstarting CSS development and creating beautiful interfaces easily.

jQuery UI Bootstrap is a jQuery UI theme that is inspired from Twitter's project and brings the slickness of it to jQuery UI widgets.

jQuery UI Bootstrap

Using the theme, it is not only possible to use the Bootstrap-themed widgets but also work with Twitter Bootstrap side-by-side without issues.

You can also read more about the motivation behind the project on the developer's web page announcing the jQuery UI Bootstrap.

Swipe JS is a lightweight (3.7kb minified) mobile slider with 1:1 touch movement (sliding content based on exact touch position).

It can display any HTML content and offers a native-like experience with features like:

  • resistant bounds (increased resistance to slide when there are no items to display next or before)
  • smart resizing on rotation as the slider resets to make sure the sliding elements are sized right
  • the size of each slide is set with the width of the container which is useful for passing different widths on responsive designs
  • detecting if you’re trying to scroll down the page or slide the content left to right

Swipe JS

Swipe is a standalone slider which doesn't rely on any JavaScript library and has few configuration options like:

  • the slide to be displayed on initial load
  • speed of transitions
  • auto slideshow to be on/off
  • and callback fired after successfully displaying a slide

Also, it has API methods for custom interactions including the display of prev-next items and getting the current position.

Textualizer is a lightweight (4kb minified) jQuery plugin for creating good looking effects on text.

The plugin accepts any number of sentences (or words) and can rotate them smartly and beautifully.

jQuery Textualizer

Once a sentence is about to rotate with the other one, the letters that will be re-used are kept and move to their new locations with several effects to choose from (fadeIn, slideLeft, slideTop).

It is possible to define the duration that each item will be displayed and also the duration of the transitions. Also, functions exist to stop or pause the rotation.

There are several awesome and feature-rich frameworks out there for building mobile web apps which can handle almost any scenario.

For complicated apps, they are usually the best option to go with. However, if you are building a simpler app that requires the most standard UI features, Zoey can be for you.

Zoey

It is a HTML5-CSS3-powered framework for creating mobile apps, built on top of Zepto.js and weights only 6kb (gzipped).

Zoey has the UI components like navigation, lists, buttons, control groups, forms and grids.

The framework is compatible with iOS + Android and comes with an app skeleton that covers all the features.

There are many jQuery slider plugins out there with each having pretty much number of features which usually end up in a big size.

Craftyslide is a jQuery image slider plugin for anyone looking to create a slider with only the standard and most-used features.

Craftyslide

It accepts unordered lists, can display captions, has a bullet navigation besides prev-next ones and uses fade animation for transitions.

Such a limited yet (usually) enough functionality only weights 2kb and works on all major browsers.

Uptime Robot
feed-holder
FeedBurner
  • PSD to HTML
  • PSD to HTML
  • aXmag - Flash Page Flip Magazine Software, PDF to Flash Converter
    ManageWP