Create Sliding Image Caption with jQuery

Sam Dunn published an article about how to create a neat sliding box image caption using jQuery at buildinternet.com. The idea is very simple as you may have seen in many portfolio websites out there, giving a cool caption to an image by adding a cover (block HTML element) with sliding animation ($.animate()) to show short description about the image.

Detail step by step tutorial available here and you could see it in action here

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

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

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:

1. Flexibility: How many situations will your plugin be able to deal with?
2. 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!
3. 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?

New Version of Jquery and JqueryUI

I got pop by tweets from john resig and jqueryui announce the release of new version jqueryui 1.7 compatible with the updated jquery core 1.3 (currently jquery 1.3.2). It comes with lots of updates includes:

• New domain and new dedicated blog
• CSS Frameworks and has hosted in Google Ajax Libraries API
• ThemeRoller V2 complements the new CSS Framework and Widget designs
• Full Offline Documentation (hell yeah this is maybe dedicated to Indonesian Jquery Fans who has unstable internet connection like me)
• Themes Bundled in Download

Couple weeks ago Jquery Core also has updated to the new version jquery 1.3.2 with some bug fixes and significant performances update. Check out the releases note for detail.