Ratchet - A Tool To Prototype iPhone Apps With HTML, CSS And JS Components

Ratchet is a tool to prototype iPhone apps with simple HTML, CSS and JS components.  Ratchet has a list of components it supports, among which are:

• Title bar - Title bars are full width and docked to the top of the viewport.
• Lists - Lists can be used for organizing data, showing collections of links or a series of controls.
• Buttons - Buttons come in four flavors and should be used for user actions.
• Segmented controller - Created with flex-box so button sizes and spacing are consistent. Content sections that are to be swapped in and out by the controller should all be siblings and have the class "segmented-controller-item". Then, just give each content section an id and point the link in the segmented controller to that id.
• Counts - Counts come in four flavors and should be used to indicate "how many" of something there are.
• Forms
• Toggles - Toggles can be used by sliding or tapping the control.
• Popovers - Popovers are designed to only fire from title bars.
• Sliders - Can be used with any number of slides with any type of content.
• Push - Push.js is the engine that connects Ratchet pages together with AJAX and the history api. Push.js is listening to all clicks on a page, so just make sure it's included and link something in your Ratchet project up.

Requirements: None
Demo: http://maker.github.com/ratchet/
License: MIT License

Juice UI - Supercharge ASP.NET Web Forms With jQuery UI

Juice UI is an open-source collection of WebForms components that brings jQuery UI Widgets to your project with ease.  Start leveraging the power of the world's most popular JavaScript UI library while working with familiar code in your ASP.NET projects.

Juice UI allows you to create flexible, interactive web applications quickly. Entice your users with behaviors such as drag & drop, resizing, sorting and selecting. Build first class apps with accordions, autocompletes, date pickers, sliders, and more.

Juice UI provides the simplicity needed for prototyping and the robustness needed for enterprise class production applications.

Requirements: jQuery UI, ASP.NET
Demo: http://juiceui.com/controls
License: MIT License or GPL

jQuery Roundabout - Converts Nested HTML Structures Into Interactive, Turntable-Like Areas

Roundabout is a jQuery plugin that easily converts unordered lists & other nested HTML structures into entertaining, interactive, turntable-like areas.

Roundabout requires jQuery (at least version 1.2, successfully tested through version 1.7.2). It works in all major modern browsers and even some of the older, not-so-modern ones. Roundabout is equipped to play nicely with a couple of other plugins if they’re made available.

It’s open source and released under the BSD license, meaning that it’s free to use in your personal or commercial projects.


Requirements: jQuery
Demo: http://fredhq.com/projects/roundabout/
License: BSD License

RefineSlide - A 3D Transform/CSS Transition-Enabled jQuery Plugin For Displaying Responsive, Image-Based Content

RefineSlide is a simple, 3D transform/CSS transition-enabled jQuery plugin for displaying responsive, image-based content (with shiny animations). CSS transitions are used wherever possible, which currently makes for varied performance across browsers and platforms. At the moment it's probably best to check it out in Safari, and will become much smoother elsewhere as other browsers move towards offloading CSS transitions to the GPU.

Features

• A few transitions to play with
• Responsive down to mobile scale
• CSS transition & 3D transform support
• Javascript fallback fade transition
• Auto-formatted, responsive thumbnails
• Good browser support (IE7+)
• HTML captions
• Hardware acceleration on supported browsers
• Free to use and abuse as you like
• Simple, semantic markup
• Lightweight: 12k minified (4k gzipped)

Requirements: jQuery
Demo: http://alexdunphy.github.com/refineslide/
License: MIT License

Quake Slider - a jQuery Image/Content Slider Plugin

Quake Image Slider is a jQuery based image slider with cool animations effects and some of them are very unique. Like SwirlFadeIn, SwirlFadeOut and more.

With Quake image slider you can combine images with short summary/caption that helps you optimize contents for search engines and make SEO easy for you. You can also link your images to open detail for particular slide/image. With Quake Image Slider you have complete control over not just the orientation of each caption also you can control animation for each caption and provide different animation for each of the slide using callbacks.

Requirements: jQuery
Demo: http://www.egrappler.com/jquery...der/index.htm
License: MIT License

MiniJs - A Suite Of jQuery Plugins Written In CoffeeScript

MiniJS is a suite of jQuery plugins written in CoffeeScript.  It consists so far, of the following components:

• Count - Minimal but powerful Letter / Word / Sentence Counter plugin! It becomes very handy especially for form validation.
• Tip - Painless tooltip plugin using CSS3 features to make its usage as simple as possible.
• Slider - Simple Slider jQuery plugin with options allowing you to customize it just like you want.
• Notification - A simple but flexible notification plugin with the minimum required functionalities.
• Feed - Just what you need to output a Twitter feed for a chosen account.
• Alert - Allows visitors to display and hide quick messages with a simple click.

Requirements: jQuery
Demo: http://minijs.com/
License: MIT License

Superslides - A jQuery Full Screen Slider Plugin

Superslides is a full screen slider for jQuery.  It's designed to be flexible, with very little styling done in the plugin itself. There's some recommended markup and CSS, but you can customize to your heart's content.

Requirements: jQuery
Demo: http://nicinabox.github.com/superslides/
License: Free

noUIslider - A Little jQuery Plugin That Turns A HTML Object Into A Nice (Range) Slider

noUiSlider is a little jQuery plugin that turns a html object into a nice (range) slider. It can have two handles to select a range, a fixed minimum or maximum to select a limit, or just two handles to pick some points.

Requirements: jQuery
Demo: http://refreshless.com/nouislider/
License: MPL v.1.1 or v2.0

ResponsiveSlides.Js - A Tiny jQuery Plugin That Creates A Responsive Slideshow Using Images Inside A Single Container

ResponsiveSlides.js is a tiny jQuery plugin that creates a responsive slideshow using images inside a single container. It works with wide range of browsers including all IE versions from IE6 and up. It also adds css max-width support for IE6 and other browsers that don't natively support it. Only dependency is jQuery and that all the images are same size.  Biggest difference to other responsive slideshow plugins is the file size (792 bytes minified and gzipped) + that this one doesn't try to do everything. ResponsiveSlides.js has basically only two different modes: Either it just automatically fades the images, or operates as a responsive image container with pagination to navigate/fade between slides.


Requirements: jQuery
Demo: http://responsive-slides.viljamis.com/
License: MIT License

jQuery.googleslides - A jQuery Plugin To Display Your Google Photos (Picasa And Google+ Albums)

jQuery.googleslides is a jQuery plugin to display your Google Photos, including Picasa and Google+ albums.


Requirements: jQuery
Demo: http://bradyholt.github.com/jquery-googleslides/
License: MIT License

Swipe - A Lightweight Mobile Slider With 1:1 Touch Movement, Resistant Bounds And Scroll Prevention

Swipe is a lightweight mobile slider with 1:1 touch movement, resistant bounds, scroll prevention, and completely library agnostic.  Swipe brings content sliding to the mobile web to preserve space and allow for new types of interaction. Many mobile web sliders currently exist but few embody all the rules a slider like this should follow.


Requirements: None
Demo: http://swipejs.com/
License: MIT License and GPL