JQuery Plugins | Bali Web Design

Posts Tagged ‘jQuery Plugins’

Posted on June 6, 2010 - by webmaster

JQuery DataGrid Plugin Compass

Compass DataGrid is yet another DataGrid plugin for jQuery with ajax-driven data support, it takes empty table and manipulate it based on JSON encoded data returned by the server side code.

JQuery Compass DataGrid has support for pagination and show/hide column also has many presentation options like: row hover styling, sorting, stripping, resizable, parameter filter etc.

Download & Demo could be found here

Posted on June 12, 2009 - by ruby

jQuery validation engine, jquery inline form validation

jQuery validation engine, yet another nice form validation plugin for jquery javascript framework, comes with language localization supported and many predefined validation rules:

optional: Special: Only validate when the field is not empty
required: Field is required
length[0,100] : Between x and x characters allowed
minCheckbox[7] : Set the maximum checkbox autorized for a group
confirm[fieldID] : Match the other field (ie:confirm password)
telephone : Match telephone regEx rule.
email : Match email regEx rule.
onlyNumber : Numbers only
noSpecialCaracters : No special characters allowed
onlyLetter : Letters only
date : Invalid date, must be in YYYY-MM-DD format

but you also could define a custom validation rule i.e:

"telephone":{
"regex":"/^[0-9-()]+$/",
"alertText":"* Invalid phone number"},

Has been tested in Internet Exploder 6 & 7, Firefox 3+, Safari 4, Chrome 1+

Download and Demos

Posted on April 5, 2009 - by ruby

jQuery flash uploader uploadify

Uploadify is a jQuery plugin that allows the easy integration of a multiple (or single) file uploads on your website. It requires Flash and any backend development language. An array of options allow for full customization for advanced users, but basic implementation is so easy that even coding novices can do it.

Uploadify is very easy to implement:

<input id="fileInput" name="fileInput" type="file" />
<script type="text/javascript">
<!--
$(document).ready(function() {
'uploader'  : 'uploader.swf',
'script'    : 'upload.php',
'cancelImg' : 'cancel.png',
'auto'      : true,
'folder'    : '/uploads'
});
// --></script>

Uploadify released under GPL and MIT licenses. Download, demo & docs could be found here

Posted on April 4, 2009 - by ruby

Accessible chart using HTML canvas & jQuery

When you working on a web based application which need a statistic report, accessible chart is one of the most important thing to achieve. It visualize a sets of data to be easier to read and analyze and it has been a tricky stuff. a great jQuery plugin has been released at filamentgroup.com, a proof of concept for visualizing HTML table data with the canvas element using and rely on top of jQuery javascript framework.

fgCharting is customizable, it uses the advantages of HTML canvas element, and it allows us to create a different type of chart easily, such as:

line chart
filledLine chart
additiveLine chart
additiveFilledLine chart
pie chart
bar chart
additiveBar chart

download, sample and detail documentation could be found here

Posted on March 12, 2009 - by webmaster

Make jQuery plugin customizable

James Padolsey at learningjquery.com has shown us how to achieve the “optimum level” of customization to jQuery plugin, with few main points:

Don’t create plugin-specific syntax
Give full control of DOM elements
Provide callback capabilities

And few considerations to be double checked:

Flexibility: How many situations will your plugin be able to deal with?
Size: Does the size of your plugin correspond to its level of functionality? I.e. Would you use a very basic tooltip plugin if it was 20k in size? – Probably not!
Performance: Does your plugin heavily process the options in any way? Does this effect speed? Is the overhead caused worth it for the end user?

Posted on March 7, 2009 - by webmaster

Beautiful jquery lightbox plugins

When I am re-designing my official website i have googling for thickbox alternatives to used in my portfolio section, thickbox is great but i need a lightbox effect plugins with beautiful predefined styles and compatible with latest jquery 1.3.1 version, and jquery lightbox below match my requirements.

(more…)

Posted on January 30, 2009 - by webmaster

Jquery plugin: Rotate image with javascript & HTML5 canvas

Following the post by Dion Almaer from Ajaxian, about interesting Jquery plugin by Pawel Witkowski, a jquery plugin to get image rotation effect directly from client side with only few lines of code

// rotate 5 degree
$('#image').rotate({angle:5});

Also able to animate it


	var oRotation=$('#image2').rotate({maxAngle:25,minAngle:-55,
	bind:
		[
			{"mouseover":function(){oRotation.rotateAnimation(85);}},
			{"mouseout":function(){oRotation.rotateAnimation(-35);}}
		]
	});

Give it a try

Posted on May 27, 2008 - by webmaster

SimpleModal yet another Jquery modal window plugin

Eric Martin has released simplemodal, yet another cool lightweight modal window library using jquery javascript framework, is there something special on this plugin? well i personaly love the 3 optional callback method onOpen, onShow, onClose give us ability to add interactive modal window with different message/action during the popup-ing process.
(more…)

Posted on March 24, 2008 - by webmaster

dfFlexiGrid – Liquid Javascript Grid Layout

web 2.0

Dezinerfolio has release dfFlexiGrid a cross browsers javascript grid based layout with integrated ease toggle effects

The dfFlexiGrid allows you to build extreme user friendly liquid grid layouts on HTML. This is another cool resource for web designers

The dfFlexiGrid comes with these features:

Variety of Layouts from 100% liquid to a custom defined stage.
Extremely smooth transition.
Retains the layout on all pages of the site (cookie based)
Miniature stand-alone JS ( 5555 bytes )
Very simple integration with any site.

Check the original post at designerfolio and the demo page here

Posted on January 10, 2008 - by webmaster

JQuery Lightbox Plugin Facebox and Balupton edition