Open Source Resources for Web Application Developers

About / Archives / Advertise / Books /Contact

Professionally Designed Web Icons for Your Websites

Style the Look & Feel of Form Elements with Uniform

19 Feb

Posted by Ray Cheung as Forms, MIT License

Have you ever wished you could style checkboxes, drop down menus, radio buttons, and file upload inputs? Ever wished you could control the look and feel of your form elements between all browsers? If so, Uniform is your new best friend.

Uniform masks your standard form controls with custom themed controls. It works in sync with your real form elements to ensure accessibility and compatibility. You can also look at Niceforms that gives your forms new themes.

Requirements: jQuery Framework 1.3+
Demo: http://pixelmatrixdesign.com/uniform/
License: MIT License

4 Comments

Symfony 2.0 – Preview Release Now Available Online

18 Feb

Posted by Ray Cheung as Framework, MIT License

Symfony 2.0 has a preview release now available online. It leads a new generation of PHP frameworks. Based on an innovative architecture, Symfony 2 is fast, flexible, and easy to learn. It allows developers to build better and easy to maintain websites with PHP.

Symfony 2.0 is up to 3 times faster than symfony 1.4 or Zend Framework 1.10 and consumes half the memory. Symfony 2.0 provides tools that greatly enhance the productivity of developers, like the famous web debug toolbar, native support for environments, detailed error pages, and more. It also comes out of the box with all the features you need to develop modern web applications. It also provides built-in security and promotes web development best practices.

It is released under the MIT license, you are free to do whatever you want with Symfony, even in a commercial environment. However, Symfony 2.0 is not yet ready for production. The final release is planned for late 2010 and will only supports PHP 5.3.2.

Requirements: -
Demo: http://symfony-reloaded.org/
License: MIT License

3 Comments

Ketchup – A Slim jQuery Plugin to Validate Your Forms

17 Feb

Posted by Ray Cheung as Forms, GPL License, MIT License

Ketchup is a slim jQuery Plugin that validates your forms. It aims to be very flexible and extendable for its appearance and functionality. Although Ketchup is designed to be styled and extended by you, it already looks tasty and gives you the most common validations by default. If there is no validation fits your needs, you can always write your own too. You can make your own ketchup with ease.

Requirements: jQuery Framework
Demo: http://demos.usejquery.com/ketchup-plugin/
License: MIT, GPL License

7 Comments

jQuery Digital Clock Inspired by HTC Hero Widget

16 Feb

Posted by Ray Cheung as Calendar, GPL License, MIT License

jDigiClock is a jQuery plugin inspired from HTC Hero Clock Widget. To use the jDigiClock plugin, simply include the jQuery library, the jDigiClock source file and jDigiClock core stylesheet file inside the <head> tag of your HTML document.

jDigiClock accepts a lot of configuration options, e.g. Clock images path, Weather images path, Set AM/PM option, Weather location code, Set weather metric mode: C or F, Weather update in minutes.

Requirements: jQuery Framework
Demo: http://www.radoslavdimov.com/jquery-plugins/jquery-plugin-digiclock/
License: MIT and GPL License

9 Comments

Automatic Image Rotator with CSS and jQuery

15 Feb

Posted by Ray Cheung as Gallery, License Free

With the release of the iPad and its lack of support for flash, it has stirred up a lot of debates regarding the future of flash. With this in mind, SohTanaka believes it is wise to build simple widgets like the image slider using HTML / CSS / Javascript, and leave more interactive applications for flash if needed.

Therefore, SohTanaka has built an Automatic Image Slider with CSS and jQuery. This html based image slider will have its benefits with SEO and will also degrade gracefully for those without Javascript enabled.

Requirements: jQuery Framework
Demo: http://www.sohtanaka.com/web-design/examples/image-slider/
License: License Free

11 Comments

Quicksand Reorder & Filter Items with Slick Shuffling Animation

13 Feb

Posted by Ray Cheung as GPL License, MIT License, Menu

We love Mac apps, especially for their attention to detail. CoreAnimation makes it so easy to create useful and eye-pleasing effects. Quicksand aims at providing a similar experience for users on the web. It can reorder and filter items with a nice shuffling animation.

At the very basic level, Quicksand replaces one collection of items with another. All you need to do is provide those two sets of items. Advanced demonstrations include custom jQuery code to achieve some of the goals, like sorting or making Ajax calls. This code can be copied and used freely, but it’s not part of the plugin.

Requirements: jQuery Framework
Demo: http://razorjack.net/quicksand/
License: MIT and GPL2 License

10 Comments

Grafico – Charting Library Built with Raphaël and Prototype

11 Feb

Posted by Ray Cheung as Charts, MIT License

Grafico is a javascript charting library built with Raphaël and Prototype.js. The library provides a wide array of graphs and stays with the guidelines laid out by Stephen Few and Edward Tufte. Grafico provides pretty charts that effectively communicate their information.

This means you get awesome graphs such as stacked area charts and sparklines, but no pie charts or bar charts with every bar a different color. Each graph type has numerous API options to customize it’s look and behavior. Some highlights: pop-up hovers, meanlines and watermarks. Minified, Grafico is about 30kb and available under the MIT license.

Requirements: Raphaël and Prototype.js
Demo: http://kilianvalkhof.com/2010/design/grafico-javascript-charting-library/
License: MIT License

4 Comments

jQuery Magic Line Sliding Style Navigation

10 Feb

Posted by Ray Cheung as License Free, Menu

jQuery Magic Line Navigation allows us to have a highlight of some kind (a background or an underline) follow you around as you mouse over the different links in the navigation. This will happen with jQuery and it’s animation abilities.

As such, the “magic line” will only be appended via JavaScript. Once added to the list and styled, as you mouse over the different links, it figures out the left positioning and the width and animates to match.

Requirements: jQuery Framework
Demo: http://css-tricks.com/examples/MagicLine/
License: License Free

6 Comments

jQuery PhotoShoot Plugin Simulates Camera-like Effect

09 Feb

Posted by Ray Cheung as Gallery, MIT License

The jQuery PhotoShoot Plugin gives you the ability to convert any div on your web page into a photo shooting stage simulating a camera-like feel. Using this plug-in, we give visitors the ability to take shots of the background image.

Each time you click the area, a new shot is added to the slide div with a negative margin to the right. After this an animation starts, which slides it in view and pushes the other shots to the left, hiding the leftmost one. You can freely use the techniques and build upon the code. There are many possible uses especially in navigation systems and promotional sites.

Requirements: jQuery Framework
Demo: http://demo.tutorialzine.com/2010/02/photo-shoot…
License: MIT License

6 Comments

Flickr-Style Photo Tagging Using jQuery

08 Feb

Posted by Ray Cheung as License Free, Tooltips

A few days ago, Ben Nadel programmed a little proof-of-concept for Flickr-style photo tagging using jQuery. He did it as an exploration in mouse-based event binding. He took a step further and packaged the jQuery code up into a jQuery plugin (phototagger.jquery.js), build a light-weight ColdFusion persistence layer (drop-and-run, no database required), and turned it into an official project: jQuery Photo Tagger.

jQuery Photo Tagger comes in at about 1,000 lines of code. As such, you can either check out the project page or try the online demo for yourself. Please note that you have to hold CTRL key when clicking mouse to create hotspot.