Open Source Resources for Web Application Developers

We have published a post about jQuery Mobile Project a couple of months ago. Today, they have pleased to announce the first alpha release of the jQuery Mobile. jQuery Mobile is a user interface framework, built on top of jQuery, designed to simplify the process of building applications that target mobile devices.

There are two guiding principles of the jQuery Mobile project that differentiates it from most other offerings: It’s completely built on the principle of progressive enhancement and is designed to be functional in all HTML-capable mobile browsers.

There are demos and documentation for all the components in jQuery Mobile 1.0a1: Theming and Layout, Headers/Footers (Fixed and Persistent), Form Controls, Dialogs, List Views, Events, Transitions.

Requirements: -
Demo: http://jquerymobile.com/
License: MIT, GPL License

• 3 Comments

When appropriate, Trevor Davis really like the ones that add smooth scrolling and highlight the navigation depending upon which part of the page you have scrolled to. That’s why he wrote jQuery One Page Navigation Plugin.

He wanted the page to scroll smoothly when the navigation was clicked, so he used the jQuery ScrollTo plugin. He also wanted the page to automatically highlight the correct navigation section depending upon which section was scrolled to, and that was where he added some custom code.

Requirements: jQuery Framework
Demo: http://trevordavis.net/play/jquery-one-page-nav/
License: MIT, GPL License

• 2 Comments

Easy Accordion plugin will get your definition lists (DTs) and generate a nice and smooth horizontal accordion. You can then decide to make it a timed slideshow or leave it still.

Easy Accordion plugin keeps the HTML to the minimum, is SEO friendly and fully accessible, uses the CSS rotation to rotate the slide titles (no need for images), works in all the major browsers, allows for autoplay, it’s opensource and fully customizable and, what count most, it’s free! And it has been tested on Firefox 3.5+, IE6/7/8, Safari 5+ and Google Chrome.

Requirements: jQuery Framework
Demo: http://www.madeincima.eu/samples/jquery/easyAccordion/
License: MIT, GPL License

• 2 Comments

The bMap jQuery Plugin allows you to quickly and easily add mapping to your website. It has been designed from the beginning to handle lots of markers, lots of layers, and custom marker icons. The plugin can manage a sidebar for you, one with a list of markers, one with a list of layers. The sidebars can be styled with CSS.

The internal Google object is exposed, so you can continue to use all of the power of the Google Maps API. You can also access the internals of the bMap object. The prerequisites of the plugin are jQuery and google maps. You will need to obtain your own Google API Key.

Requirements: jQuery Framework
Demo: http://www.blocsoft.com/bmap/
License: GPL License

• 7 Comments

EditableGrid is an open source Javascript library aimed at turning HTML tables into advanced editable components. It focuses on simplicity: only a few lines of code are required to get your first table up and running.

It loads grid from XML or attach to an existing HTML table. Built-in validators for columns of type integer, double, url, email and date. Sort columns accordingly to their types, by clicking on the column header. Open Flash Chart integration to render charts from the grid data. Callbacks for all events: load, edition, sorting, etc.

Requirements: Javascript Enabled
Demo: http://www.webismymind.be/editablegrid/
License: GPL License

• 3 Comments

imgAreaSelect is a jQuery plugin for selecting a rectangular area of an image. It allows web developers to easily implement image cropping functionality, as well as other user interface features, such as photo notes like those on Flickr.

imgAreaSelect is highly configurable and customizable with CSS styling. Keyboard support for moving and resizing the selection. It works in all major browsers, including Firefox 2+, Opera 9.5+, Google Chrome, Safari 3+, and Internet Explorer 6+.

Requirements: jQuery Framework
Demo: http://odyniec.net/projects/imgareaselect/
License: MIT, GPL License

• 1 Comment

The xcolor plugin is an easy-to-use jQuery extension to manipulate colors in all imaginable combinations. This plugin implements an extensiv color parser and a featureful set of color-manipulation methods. There is also an animate() extension to smooth CSS colors.

Another useful method isReadable() completes the whole, by allowing you to check if a text is readable on a certain background. The color value can also be passed in different color models: RGB, HSV/HSB, HSL and their adequate alpha extensions.

Requirements: jQuery Framework
Demo: http://www.xarg.org/project/jquery-color-plugin-xcolor/
License: MIT, GPL License

• 2 Comments

jQuery Image Scroller Plugin creates a scrollable interface to scroll over a large image in a smaller area. The idea is that we have a container with a fixed height and width, an image that is taller than the container, and a container for the thumbnail of that image.

Once the plugin is applied, there is a span with a class of indicator appended to the small preview area which represents the area you can drag up and down.

Requirements: jQuery Framework
Demo: http://www.viget.com/uploads/file/image-scroller/
License: MIT, GPL License

• 2 Comments

HTML5 Boilerplate is the professional badass’s base HTML/CSS/JS template for a fast, robust and future-proof site.

After more than two years in iterative development, you get the best of the best practices baked in: cross-browser normalization, performance optimizations, even optional features like cross-domain ajax and flash. A starter apache .htaccess config file hooks you the eff up with caching rules and preps your site to serve HTML5 video, use @font-face, and get your gzip zipple on.

Boilerplate is not a framework, nor does it prescribe any philosophy of development, it’s just got some tricks to get your project off the ground quickly and right-footed.

Requirements: -
Demo: http://html5boilerplate.com/
License: MIT, GPL License

• 6 Comments

CLEditor is an open source jQuery plugin which provides a lightweight, full featured, cross browser, extensible, WYSIWYG HTML editor which can be easily added into any web site.

In addition to the standard text formatting features found in other WYSIWYG editors, CLEditor also contains rich drop downs for font name, size, style, text color and highlight color. CLEditor allows you to insert images, hyperlinks and horizontal rules.

CLEditor supports the following browsers on both the mac and pc: IE 6.0+, FF 1.5+, Safari 4+, Chrome 5+ and Opera 10+. All testing is done using jQuery 1.4.2.

Requirements: jQuery Framework
Demo: http://premiumsoftware.net/cleditor/
License: MIT, GPL License

• 4 Comments