background preloader

Chosen - a JavaScript plugin for jQuery and Prototype - makes select boxes better

Chosen - a JavaScript plugin for jQuery and Prototype - makes select boxes better
Chosen is a jQuery plugin that makes long, unwieldy select boxes much more user-friendly. Downloads Project Source Contribute Standard Select Turns This Into This Multiple Select <optgroup> Support Single Select with Groups Multiple Select with Groups Selected and Disabled Support Chosen automatically highlights selected options and removes disabled options. Single Select Multiple Select Hide Search on Single Select The disable_search_threshold option can be specified to hide the search input on single selects if there are n or fewer options. Default Text Support Chosen automatically sets the default field text ("Choose a country...") by reading the select element's data-placeholder value. Note: on single selects, the first element is assumed to be selected by the browser. No Results Text Support Setting the "No results" search text is as easy as passing an option when you create Chosen: Limit Selected Options in Multiselect You can easily limit how many options the user can select: Right to Left Support

Related:  13/2/7 - 00jQueryFront-end

jQuery Nested Nested is a jQuery plugin which allows you to create multi-column, dynamic grid layouts. Unlike other libraries and jQuery plugins similar to Nested, this is (as far I as I’ve know) the first script out there that allows you a complete gap-free layout. How is this done? Nested does three things. Transitional Interfaces, Coded Pasquale D’Silva’s article Transitional Interfaces has really been making the rounds. It's a quick read that drives home a great point. Transitions and animations can be more than eye candy. They can help give your brain a clue about what is happening on a page. If a list item is inserted into a list, rather than having it suddenly appear, an animation that moves the list to make room makes it extremely obvious what is going on. Otherwise it's blink-and-you-miss-it.

jQuery Overtakes Flash on World’s Top Websites “Developers are choosing jQuery over Flash for new development,” said Mike Hostetler, co-founder and CEO of appendTo. “This data confirms a trend that’s been a couple years in the making. More and more website developers are choosing jQuery and JavaScript over Flash and the rate at which this transformation is occurring is only accelerating.” jQuery UI Bootstrap – A New Bootstrap-inspired Theme For Your Widgets I recently released the first version of a new project called jQuery UI Bootstrap – a Twitter Bootstrap inspired theme for UI widgets. For a demo of the theme or to download it, hop on over to the project homepage. Introduction Bootstrap was one of my favorite OS projects to come out of 2011 and I found myself regularly using it a base for a number of projects, both at work and otherwise. However, whilst planning out the user-interfaces for some new projects at AOL, I ran into a problem:

Resources for getting started with Backbone.js The current product I am building makes heavy use of HTML5 & javascript to give the user a rich experience, both on and offline, across a variety of screens. Before I even started this application I knew I wanted a clean and proven approach to help manage the complexity on the client. After reviewing several js frameworks I decided to go with backbone.js (compare yourself). I have been working with backbone for several months and I am really happy with it, and would recommend to anyone building similar types of javascript applications. As per the project description: alertify.js - browser dialogs never looked so good Unfortunately, I will no longer be maintaining alertify.js. I have many ongoing projects that aren't leaving me with enough time to do what needs to be done. If anyone wants to create a fork and maintain - by all means go for it! It's been great seeing people use it and enjoy it and this decision is simply because I don't believe it's fair that developers are looking for help and not getting it.

Extending HTML5 — Microformats While HTML5 has a bunch of semantic elements, including new ones like <article> and <nav>, sometimes there just isn’t an element with the right meaning. What we want are ways to extend what we’ve got, to add extra semantics that are machine-readable — data that a browser, script, or robot can use. Native ways to extend HTML There were five fundamental ways we could extend HTML 4: Sample App with Backbone.js and Twitter Bootstrap Backbone.js is a lightweight JavaScript framework that provides the basic infrastructure (Model, Collection, View, and Router classes) to bring structure to your Web applications. Twitter Bootstrap is a UI toolkit that provides simple and flexible HTML, CSS, and Javascript to implement popular user interface components and interactions. In other words, Backbone.js and Twitter Bootstrap focus on different areas of your application: core architecture and user interface respectively. Because of their well-defined and non-overlapping scope, Backbone.js and Twitter Bootstrap work well together. In general, I find a lightweight architectural framework and a UI toolkit to be a powerful combination, and an interesting alternative to full-stack frameworks: it gives you the flexibility to choose the library you like (if any) in the respective areas of your application. The Sample Application

jQuery CollagePlus - an image gallery plugin by Ed Lea This plugin for jQuery will arrange your images to fit exactly within a container. You can define the padding between images, give the images css borders and define a target row height. Example: Play with a live example on jsfiddle: or take a look at the demo Basic Usage 5 Excellent jQuery Mobile Tutorials Recently jQuery Mobile Alpha 2 was released. One major goal of the project is to reach more than the top-tier mobile Web browsers such as those used in Apple’s iOS, Google’s Android, BlackBerry OS, mobile versions of Window and Hewlett-Packard’s Web OS. With jQuery Mobile, developers can write applications for a number of mobile devices, including smartphones and tablets. Although jQuery Mobile is still relatively new, I was able to find some of excellent jquery mobile tutorials. In this article I will share with you 5 excellent jQuery mobile tutorials that you can use as a guide to learn jQuery Mobile. How to Build an RSS Reader with jQuery Mobile

Extensions, Plugins, Resources · documentcloud/backbone Wiki Dependencies Underscore.js Backbone's only hard dependency. JSON2.js Needed if you'd like to parse and serialize JSON in older browsers (read: "Internet Explorer") Owl Carousel 1. Load jQuery and include Owl Carousel plugin files To use Owl Carousel, you’ll need to make sure both the Owl and jQuery 1.7 or higher scripts are included. 2. Set up your HTML

transforming select boxes into nicely styled jquery fields by lastik Dec 29

Related:  backbone.jsJQuerybootstrappluginjQueryjquery pluginsLayoutnickleus