Open Source Resources for Web Application Developers

Agile Carousel is a jQuery plugin that allows you to easily create a custom carousel. Call jQuery UI to enable many different additional transition types and easing methods. It uses PHP to draw images from the folder you specify.

You can also configure Agile Carousel with many different options including controls, slide timer length, easing type, transition type (e.g. blind, drop, pulsate, shake, slide and etc…) and more. The script is currently in beta version, security & feature enhancements are on the way.

Requirements: jQuery Framework
Demo: http://code.google.com/p/agile-carousel/
License: New BSD License

• 3 Comments

This dynamic JavaScript slideshow is feature packed and under 5KB. You can find the new features include description support, link support, no naming restrictions, portrait image support, graceful degradation and active thumbnail status.

The init function takes 5 parameters (id of the slideshow content placeholder, the id of the image placeholder, the id of the previous image placeholder, the id of the next image placeholder, the id of the image link placeholder).

This script has been tested in Firefox, Internet Explorer, Opera, Safari and Chrome. This script is available for any personal or commercial projects under the creative commons license and is offered as-is, no free support provided.

Requirements: Javascript Enabled
Demo: http://sandbox.leigeber.com/javascript-slideshow/
License: Creative Commons License

• 8 Comments

The s3Slider jQuery plugin is made by example of JonDesign’s smooth slideshow script. The author needed something like that for jQuery. Since he didnt find it after a small research, he decided to build it by himself. This script is licensed under Creative Commons Attribution 2.5. So you can use it in all you projects even commercial ones. This plugin has been tested and is known to work in Firefox, Opera, Safari, Internet Explorer and Google Chrome.

Requirements: jQuery Framework
Demo: http://www.serie3.info/s3slider/demonstration.html
License: Creative Commons 2.5 License

• 6 Comments

SexyLightBox is a clone of the classic lightbox, but it is more lightweight and it looks sexier. It was built for web designers, so it is really easy to install and use. SexyLightBox supports all sorts of images of different sizes and HTML elements. The images larger than the browser, are adjusted automatically to see them completely. I really like the bouncy effect when the box comes out and resizes.

Requirements: Mootools Framework 1.2
Demo: http://www.coders.me/ejemplos/sexy-lightbox-2/
License: MIT License

• 7 Comments

CrossSlide is a jQuery plugin that implements in Javascript some common slide-show animations, traditionally only available to the web developer via Adobe Flash™ or other proprietary plugins. CrossSlide builds upon jQuery’s animation facility, so it is as portable across browsers as jQuery itself.

CrossSlide can do simple Static cross-fade, Slide + cross-fade and Ken Burns effect: panning, zooming and fading to specific points, to guide the eye of the viewer and convey meaning. This kind of effect relies on the browser for positioning, scaling and cropping images, through CSS and the DOM.

However it depends heavily on how the browser and the underlying graphics platform optimize these operations. Compared to native implementations of the same effects, CrossSlide is quite CPU-intensive, but recent hardware handles it without problems.

Requirements: jQuery Framework
Demo: http://www.gruppo4.com/~tobia/cross-slide.shtml
License: GPL License

• 3 Comments

FlashGallery is a free, simple photo gallery built in Macromedia Flash 2004, that uses XML files to store the information about which images to display. The gallery is easy to configure and update since you need to change only the XML file. It supports Latin, Cyrilic, Chinese and any other language you can think of. Also, it is really lightweight with only 11KB. It may be used in any kinds of personal and or commercial projects.

Requirements:Flash 2004+
Demo: http://www.flashgallery.org/demo.html
License: License Free

• 8 Comments

AutoViewer is a free, customizable Flash image viewer. AutoViewer is designed to display a linear sequence of images and captions. It displays image captions and gallery title as a text overlay.  The Interface rescales to fit any aspect ratio images and monitors. And image pre-loading is added to prevent waiting for each image to load. After all, it is free to use. AutoViewer may be used in any kinds of personal and/or commercial projects. But, please ensure that the AutoViewer download link in the bottom right corner is clearly visible.

Requirements:-
Demo: http://www.airtightinteractive.com/projects/autoviewer/app/
License: License Free

• 9 Comments

Devthought has created an elegant, lightweight slideshow script called BarackSlideshow. It works with MooTools 1.2, and supports all kinds of shape transformations (top and left coordinates, and height and width properties), which means it can now be used with vertical, horizontal, or even irregular lists. Devthought came up with a new class that receives the images and loading spinner as parameters as well.

The CSS plays a major role. You should analyze it carefully before implementing it in your applications or websites. You’ll probably need to adjust the ids, or use classes instead to keep your stylesheets clean.

Requirements: Mootools Framework
Demo: http://devthought.com/wp-content/moogets/BarackSlideshow/demo.html
License: MIT License

• 4 Comments

This is an automated news slider using the new AS3 XML features. The main propose of this news slider is show news on the front page, with a title, an image, some descriptive text, and a link to the full article. It loads 4 articles and changes from one article to another automatically in a lapsus of time, and the user could stop, rewind or forward whenever he wants. The data source uses XML, so it could be adapted to any programming language that could generate XML data.

Requirements: -
Demo: http://works.faustocarrera.com.ar/news_slider/
License: License Free

• 2 Comments

Nick La has made another great great tutorial for us. Nick La shows us how to decorate our images and photo galleries without editing the source images. The trick is very simple. All you need is an extra tag and apply a background image to create the overlaying effect. It is very easy and flexible with over 20 styles, from a simple image icon to a rounded corner to a masked layer (both decorative and complex). To change the look and feel, simply edit the CSS specifications of the span element. To show how flexible it is, Nick La has created 15 different styles as examples for us (notice the HTML markup is same).

Source: CSS Decorative Gallery

• 10 Comments