Archives for 2009

Fancy (jQuery) AJAX Captchas – For an Awesome User Experience

Last updated on December 30th, 2009 by Gabriel Livan

Do you want to have a nice protection against SPAM on the forms of your website? Checkout the following scripts:

AJAX Fancy Captcha is a jQuery plugin useful to prevent your forms from being automatically submitted by bots. The coll thing about it is that you don’t have to type a security code to prove that you are a human. You only need to drag & drop an object into a specific area.

Catpcha’s security level is medium with the emphasis of nice looking and user friendly quality, while still offering reasonable protection against unwanted “guests”.

The basic design and its elements can be easily changed and customized.

Source & Demo: http://www.webdesignbeach.com/beachbar/ajax-fancy-captcha-jquery-plugin
Download: http://www.webdesignbeach.com/ajax-fancy-captcha-0.1.zip

s3Captcha is a jQuery plugin made by an example of WebDesignBeach Ajax Fancy Captcha. Instead oftyping hardly readable letters and number you just have to select an icon from a set of icons.

Quick features:

It’s a very small and simple to setup script
Compatible with most modern browsers
Customizable: you can add new icons or change the current ones

Source: http://serie3.info/s3capcha/
Download: http://serie3.info/s3capcha/style/code/s3capcha.rar
License: Creative Commons Attribution 2.5
Tested on: Firefox 3.0.8 (Win/Linux/Mac), Opera 9.6 (Win), Safari 4 (Win/Mac), Internet Explorer 6 (Win), Internet Explorer 7 (Win), Internet Explorer 8 (Win), Google Chrome (Win)

Collection of Free ToolTips using AJAX, JavaScript & CSS

Last updated on March 14th, 2010 by Gabriel Livan

A tooltip is a short and informative text that appears in a box that pops out when you hover the mouse cursor over an element (link, button, div etc.).

1. DHTML JavaScript Tool Tips is a JavaScript Cross Browser library to create tool tips (information pop-up boxes). This script can be customized in multiple ways and may contain plain-text as well as HTML (images, line breaks).

* Implementation
1. Download the JS File: wz_tooltip.js.
2. Include the library in your HTML page by inserting the following line in the BODY section of your page (it can be added after the last tag containing a tool tip):

<script language="JavaScript" type="text/javascript" src="http://www.your-domain-name.com/path/to/wz_tooltip.js"></script>

3. Each of the tags requires only the onMouseOver attribute (onMouseOut is not required):

<a href="photos.htm" onmouseover="return escape('Your text here')">Photos</a>

* Browsers Compatibility: Netscape 4 and 6+, Mozilla, Galeon, Opera 5, 6 and 7+, MSIE 4, 5+, Konqueror 3

2. Fading JavaScript Tooltips 2kb is an animated JS tool tip script that is very easy to use and lightweight. To see how the script is implemented check the index.html file from the ZIP archive.

Tested in: IE6+, FireFox, Opera, Safari

To see a walk-through of the code and the logic check this post.

Read more from this entry…

Beautiful Set of Free Social Media Icons: WeFunction

Last updated on December 30th, 2009 by Gabriel Livan

This is an excellent & free unique set of social icons from WeFunction. A small bonus is offered to anyone who buys the full set.

The set is perfect for anyone who is building a website, an online application or any app of any kind. It’s similar in style to other icon sets from WeFunction. Therefore, you can use them along side with any of the other sets.

Source: http://wefunction.com/2009/05/free-social-icons-app-icons/

Add Some Life to Your Colors: ColoRotate

Last updated on December 30th, 2009 by Gabriel Livan

ColoRotate is an AWESOME tool useful to browse and create your color palettes in 3D mode & real time, offering you the freedom to let your imagination fly. This online tool is innovative because it removes the conventional complexity in colors selection on computers and it’s easier to use than the traditional computer palettes.

Joining the ColoRate community is absolutely free and you can use your Google Account to do that. Your personal information remains completely confidential. You can save your color palettes, share them with other members and also participate in the full spectrum of the ColoRotate community.

This excellent tool is efficient because offers you the possibility to quick drag-and-drop to adjust hue, brightness and saturation. Moreover you can import and export in Adobe Swatch Exchange (ASE).

ColoRotate’s intuitive interface helps you to eliminate the need to memorize or jot down color combinations or numbers. Indeed, you can traverse across an open three-dimensional color space and choose (or design) the color palette that fits your needs. In the process, you can uncover color relationships that give your designs an aesthetic balance that will please the most discriminating eye.

Source: http://www.colorotate.org/

Uploading Files with Progress Bar using jQuery & MooTools

Last updated on January 3rd, 2010 by Gabriel Livan

Uploadify is a JQuery Plugin that allows you to easily upload multiple files on your site without needing to reload the page. The script requires Flash and any backend development language. A progress bar is shown while uploading the file(s). The plugin can be used in a number of applications and commercial products.

FancyUploader is a MooTools file-input replacement script which features an unobtrusive, multiple-file selection menu and queued menu with an animated progress bar. It’s easy to integrate, being server independent & completely customizable via CSS and XHTML.