2009-02-28

Run All Windows Browsers Simultaneously From the Web

The Xenocode Browser Sandbox allows all popular Windows browsers to be run simultaneously, directly from the web. Web designers, system administrators, and other users can now evaluate Internet Explorer 8, 7, and 6, Mozilla Firefox, Apple Safari, Opera, and Google Chrome directly from the web in a risk-free manner.

Unlike traditional software applications, Xenocode WebApps do not require any software to be installed and allow multiple application versions to run side-by-side on any version of Windows.

You can also test your website in different browsers with Browsershots.

Source: http://www.xenocode.com/browsers/

Display Easily Accessible Tabular Data with DataTables

DataTables is a jQuery plugin for building tables. It was designed for progressive enhancement of tabular HTML data, giving the end user a wide range of options for customising the display of that data as they wish. It is very easy to integrate DataTables directly into your web-site or web-application.

The core features of DataTables includes Ajax auto loading of data, Variable length pagination, Multi-column sorting, Single column filtering, Type detection for dynamic data, Smart handling of column widths, Fully internationalisable, Themeable by CSS and it is Free!

Requirements: jQuery Framework
Demo: http://www.sprymedia.co.uk/dataTables-1.4/example_zero_config.html
License: GPL, BSD License

Growl for Rails Built on Prototype and Scriptaculous

Growl4Rails is a javascript component that provides the UI for growl-like notifications in your Rails web application. Jim Fiorato has recently added the ability to show multiple growls at once, as well as improved support for IE. You can also specify the duration and max number of growls to show.

If you are not using Rails, you can also get the Growl for jQuery and Growl for Mootools instead.

Requirements: Rails 2.1+, Prototype 1.6+, Scriptaculous 1.7+
Demo: http://github.com/jfiorato/growl4rails/tree/master
License: MIT License

Javascript Dependency Management for Ruby on Rails

Sprockets is a Ruby library that preprocesses and concatenates JavaScript source files. It takes any number of source files and preprocesses them line-by-line in order to build a single concatenation.

Specially formatted lines act as directives to the Sprockets preprocessor, telling it to require the contents of another file or library first or to provide a set of asset files (such as images or stylesheets) to the document root. Sprockets attempts to fulfill required dependencies by searching a set of directories called the load path.

If you use and contribute to open-source JavaScript frameworks and libraries that use Sprockets, like Prototype and script.aculo.us, the build processes for those scripts can be integrated directly into your application. That makes it possible to track the latest development versions of your framework and library dependencies by adding their repositories to your Sprockets load path.

Requirements: Ruby on Rails Framework
Demo: http://getsprockets.org/
License: MIT Licenses

Chevereto - Open Source One-Click Image Hosting Script

Chevereto is an open-source image hosting script that allows you to mount your own one-click image hosting on your server. It is very simple to use, you will love it by their appearance.

It allows you to resize images, verify its integrity and integrate it with url shorteners like TinyURL. And also, you can install Chevereto quickly, requires no database and is configurable.

Requirements: PHP
Demo: http://demo.chevereto.com/
License: GPL Licenses

2009-02-22

dfGallery 2.0 - Free Flash Gallery with Custom Themes

Few months ago, we have seen one of the best free flash galleries - dfGallery. There are a lot of great features. It allows integration of most popular photo sharing sites like Flickr , Picasa , Photo Bucket and Fotki along with background music.

Now, dfGallery 2.0 has just released. The reason for this gallery to be cool is not just its UI but the way it is built and architected. They have an amazing theme engine built to support custom themes with multiple skins for each. The administration console built on CodeIginter lets you manage multiple galleries and albums of different types.

This is just the alpha release and they expect lots of feedback to get this to its best possible.

Requirements: Flash
Demo: http://dezinerfolio.com/demo/dfgallery/dfg2/test_embed.html
License: Apache License 2.0


FancyZoom in Prototype with Small Changes

Some time ago, we have featured FancyZoom which is designed to view full-size photos and images inline without requiring a separate web page load. After few months, Orderedlist rewrote it in Prototype with some small changes.

First, He didn’t like that it used AJAX. FancyZoom in Prototype tends to lean towards the side of rendering everything and then showing and hiding, rather than loading stuff with AJAX.

Second, Cabel built his from scratch with no use of any JavaScript libraries. That is cool and all, but he almost always have Prototype and Scriptaculous included. Cabel’s version without Prototype is two scripts that weigh in at 36k. Orderedlist’s version with prototype is only 12k.

Third, Cabel’s implementation only works for images and it loads them via AJAX (to save initial page weight). He thinks that the zoom interaction is pretty interesting so he didn’t want a version limited to just images. FancyZoom in Prototype supports pretty much any html you can throw in a div (images, text, flash, etc.).

Fourth, and final, is that he liked Apple’s rounded corners, as opposed to the original fancy zoom’s square edges.

Requirements: Prototype Framework
Demo: http://orderedlist.com/demos/fancy-zoom/
License: License Free

jQuery Navigation Control to Manage Alphabetical Lists

jQuery ListNav Plugin supplies an easy way to unobtrusively add a letter-based navigation widget to any UL or OL list. An easily stylable (via CSS) nav bar appears above the list, showing the user the letters A-through-Z.

Clicking one of the letters filters the list to show only the items in the list that start with that letter. Hovering over a letter (optionally) shows a count above the letter, indicating how many items will be displayed if that letter is clicked. Other options give you control over the basic functionality.

ListNav works great on long lists. It supports multiple lists on the same page. And it has been tested on IE6, IE7, Firefox 2 and 3 (Windows and Mac), Safari (Windows and Mac).

Requirements: jQuery Framework
Demo: http://www.ihwy.com/Labs/Demos/Current/jquery-listnav-plugin.aspx
License: MIT, GPL License

SitePoint CSS, HTML & JavaScript Online References

The SitePoint online CSS and HTML references have been available for some time now, and have already become a valued source of free information for web designers and developers around the world. Recently, Sitepoint has announced a shiny new look to the SitePoint Reference Site and the highly anticipated first release of JavaScript Reference Information.

The look and feel of the old reference site has been completely replaced with a brand new slick, easy-to read design, including interactive examples, improved navigation, page layout and much more…

Source: SitePoint CSS, HTML & JavaScript Online References

JS Charts - Free Javascript Chart Generator

JS Charts is a free JavaScript based chart generator that requires little or no coding. With JS Charts drawing charts is a simple and easy task, since you only have to use client-side scripting (i.e. performed by your web browser). No additional plugins or server modules are required. Just include the scripts, prepare your chart data in XML or JavaScript Array and your chart is ready.

JS Charts lets you create charts in different templates like bar charts, pie charts or simple line graphs. It’s compatible with most web browsers. And it is It’s free to use and watermark-free.

Requirements: Firefox 1.5 +, IE 6, Safari 3.1 +, Opera 9 +
Demo: http://www.jscharts.com/examples
License: Creative Commons 3.0 License

Drag and Drop Ajax Fancy Captcha jQuery Plugin

Ajax Fancy Captcha is a jQuery plugin that helps you protect your web pages from spammers. It is a new intuitive way of completing “verify humanity” tasks. In order to do that you are asked to drag and drop specified item into a circle.

Captcha’s security level is medium, with the emphasis on nice looking and user friendly qualities while still offering reasonable protection from unwanted “guests”. Basic design and its elements are easy to change and customize.

Requirements: jQuery Framework
Demo: http://www.webdesignbeach.com/beachbar/ajax-fancy-captcha…
License: License Free

Quickly Review Code Quality with YAML Debug Bookmarklet

YAML Debug is an assistive tool for web developers, that allows you to quickly review code quality and semantic structure of any website (particularly based on YAML) as well as testing it against common oversights.

YAML Debug detects the content encoding and counts all external style sheets, script elements and images on your webpage. In the style sheet tab, all external and embedded style sheets are listed in source order. By clicking on a style sheet, it can be disabled or enabled. YAML Debug lets you easily visualize the semantic code structure of any webpage, giving you a quick overview whether it has meaningful semantics or not.

Requirements: Firefox 3.x, Opera 9.x
Demo: http://debug.yaml.de/
License: License Free

Best 5 Sets of Emoticons Download for Free

In web forums, instant messengers and online games, text emoticons are often automatically replaced with small corresponding images, which came to be called emoticons as well. Examples of widely known emoticons are the smiley face : ) and the frowny face : (.

We have selected the best 5 sets of emoticons we have found on the internet. You can use them on your blog, forums and even web applications for free. Please feel free to suggest your favourite ones we did not mention.

2S-Space Emotions V2

The Blacy Emoticons

Yolks 2 Emoticons

Say Emoticons

Buttery Emoticons


Mootools Double Pinned Slider with Range Indicator

Nikhil had been looking for a double pinned slider (slider with two knobs , minimum and maximum) using mootools. Though , he did find a few well done double pinned slider in the mootools forum, the only problem was that all these sliders did not have the selected range marker.

Finally! He has decided to create his own Mootools Slider With Two Knobs (Double Pinned Slider) with Range Indicator. You can easily change the look and feel of the range indicator, slider knob, the slider track by modifying the slider.css as required. You can also look at the Slider for jQuery we mentioned eailer.

Requirements: Mootools Framework
Demo: http://developer.expressionz.in/downloads/mootools…
License: License Free

Ajax Tags Auto Suggestion jQuery Plugin

If you’re familiar with del.icio.us you will be familiar with the tag suggesting as-you-type support. the tagging works so well within del.icio.us is that it helps you create a subset of tags that you commonly use for different types of links.

This way, it makes it easier to find tagged content later on. i.e. conversely if it didn’t suggest links, it would be likely that you would have different variations or even spellings of the same tag on (what should be) grouped content.

So, in an effort to adopt this approach, Remy Sharp has created a jQuery plugin for tag suggestion. The plugin has been tested on IE 7, Firefox 2, Safari 3 and Opera 9.

Requirements: jQuery Framework
Demo: http://remysharp.com/wp-content/uploads/2007/12/tagging.php
License: License Free

Create iCal-like Calendars with CSS and jQuery

One of the most common requests from clients when it comes to Wordpress personalization, is to add a basic event calendar to their website. Finding a good place to position a big table like a calendar within your Wordpress template is always a taught work. In addition, the

tag itself is often quite difficult to style in a good way.

Therefore, Stefano Verna came up with astonishing iCal-like calendars with jQuery. All the magic takes place with some ninja CSS. In addition to the plain calendar structure, You can see a lightweight Coda-like effect for events description popup as well.

Requirements: jQuery Framework
Demo: http://www.stefanoverna.com/wp-content/tutorials/ical_like_calendar/
License: License Free


Open Source Live Support Web Messenger

Web Messenger is an open-source live support software allowing visitors of your site to chat with your operators. It makes easier to communicate with existing and potential clients. It will significantly increase conversion rates and online sales of your web site.

You can place the button of Web Messenger at your site. Your visitors click the button and chat with your operators who help them. This program and the accompanying materials are made available under the terms of the Eclipse Public License v1.0.

Requirements: PHP 5.0+, MySQL 5.0+
Demo: http://openwebim.org/demo.php
License: Eclipse Public License v1.0

Supersized - Full Screen Slideshow jQuery Plugin

Supersized is a jQuery plugin that automatically resizes (background) images to the size of the browser while maintaining image dimension ratio and runs them as a slideshow. There is no extra whitespace, no scrollbars - the entire browser window is always filled. It is lightweight and plays nice with Firefox, Safari, Opera, IE7, and IE6.


Requirements: jQuery Framework
Demo: http://buildinternet.com/live/supersized/
License: License Free

The Community-built Open Source Online HTML Editor

Xinha is a powerful WYSIWYG HTML editor component that works in Mozilla based browsers as well as in MS Internet Explorer. Its configurabilty and extensibility make it easy to build just the right editor for multiple purposes, from a restricted mini-editor for one database field to a full-fledged website editor. Its liberal, BSD licence makes it an ideal candidate for integration into any kind of project.

Xinha is Open Source, and they take this seriously. There is no company that owns the source but a community of professionals who just want Xinha to be the best tool for their work.

Requirements: -
Demo: http://xinha.webfactional.com/wiki/Examples
License: BSD License