60+ Stunning Scriptaculous Applications
Categories: JavaScript, LightBox, Programming, Script.aculo.us
Tags: API, JavaScript, Programming, Script.aculo.us
Written By: admin
Advertisement
This post will help you in checking out most stunning Script.aculo.us Applications in the World of Web and at the same time might help you in coming up with new web applications using Script.aculo.us. I would like to request all the developers to have a look at these stunning applications which are made and developed by Script.aculo.us

Prototip: Create beautiful tooltips with ease
Prototip allows you to easily create both simple and complex tooltips using the Prototype javascript framework.
- Style: Easy to customize.
- Position: Complete control over tooltip positions.
- Round: Configurable rounded corners, no PNG images required.
- Speech bubble effect!
- Works on all modern browsers.

Yesterday I was looking at the Scriptaculous library, in particular the slider bar. I had used it once before with some success, using a graphic for the track and gripper. But that’s was boring! What I wanted was to see the bar fill up with colour when it was slide.

Star Box: rating stars for prototype
Starbox allows you to easily create all kinds of rating boxes using just one PNG image. The library is build on top of the Prototype javascript framework. For some extra effects you can add Scriptaculous as well. Check the demos below to see what Starbox is all about and read on for more information on how to customize your own Starboxes.

After some careful debugging and research, I was able to pin down the problems with the Mac clients, so I set out again to try and put this to bed. Tonight, I would like to introduce to you Lightbox++. The browser compatibility problems should be resolved, and the script now retains the ability to use regular Lightbox functionality, with the added ability to embed your Flash videos.

JavaScript Image Cropper UI, using Prototype & script.aculo.us
The JavaScript image cropper UI allows the user to crop an image using an interface with the same features and styling as found in commercial image editing software, and is is based on the Prototype JavaScript framework and script.aculo.us.
Initially I performed quite a lot of searching for some ready made solutions to meet my requirements, but found none that had the complete feature set that I required or any complete versions based on Prototype.
So after a week and a half of work, I present the JavaScript image cropper

Move your mouse over the words at the left to see how an effects work. Holding your mouse over the effect with repeat it. If you move your mouse over another effect, it will start when the previous effect finishes.

- Supports EVERY Media type and renders it appropriatly.
- Better Animations!
- All video/media bugs have been resolved!
- More functions for you to access!
- Major improvements to IE!
- Create your own custom overlays including transparent patterns!
- Galleries [Anything can be a gallery, the only limitation is your theme and markup]
- You can create your own theme including markup/css/animations.
- Automatically detects media and source.
- A variety of parameters are available to further customize the experience.
- Window will fit content fetched! Excludes i-frame content!

Scriptaculous Sortables Demo with Ajax Callback
Built with Scriptaculous 1.7 Beta 2. Drag items in the list below. Each time you update the list an Ajax call is made that updated the database with the new order.

Fancy Sliding Tab Menu using script.aculo.us
Well I’ve been at it again looking at new ways in which I can make good use script.aculo.us effects. I started by looking at the accordion this time and ways in which it can be developed to produce different results. The most common example that I knew of was the Rico accordion, so that’s where I decided to start.
As you can see below it looks quite cool and can add some nice interaction to any site. At this stage, however, I’m not going to write too much about the code behind it as I am still working on it but I thought it may be interesting for people to have a look at.

Opacity change using Scriptaculous
Scriptaculous is a great framework to implement superb animated effects for your website. It’s simple to use and in general final result is awesome.
This tutorial explains how to use Scriptaculous to implement a nice “change opacity” effect for a layer and its content.

Below are remaining awesome list:
- Carousel Vertical and Horizontal Samples – miedlar.com
- e24Squares – AJAX Pictures transition effect – flash-free.org
- Portal test page – blog.xilinus.com
- Drag to Download – ryanscherf.net
- Sexy sliding JavaScript side bar menu using mootools – andrewsellick.com
- Ajax in place select – subzane.com
- Add scroll buttons to Scriptaculous Slider? – forums.pragprog.com
- Integration of Scriptaculous slider in Zend framework – blog.alfbox.net
- script.aculo.us Slider plugin – railslodge.com
- Adding More Features to Sliders with the Scriptaculous Framework – devarticles.com
- Scriptaculous Slider Code Generator (v0.01a) – http://ouseful.open.ac.uk/blogarchive/sliderCreator.html
- Slider Demos – aldenta.com
- Another dual slider using ASP.NET AJAX and script.aculo.us – dimebrain.com
- ModalBox – wildbit.com
- Sortable Lists – demo.script.aculo.us
- Auto-Scrolling Page Navigation – speckyboy.com
- A CSS Crossfader – mikeomatic.net
- Adding cool image effects using the Script.aculo.us Javascripts – wysiwygwebbuilder.com
- e24TabMenu – AJAX Dropdown Tab Menu – flash-free.org
- Script.aculo.us tab navigation example – blog.brianflove.com
- script.aculo.us Reflector – mir.aculo.us
- Accordion v2.0 – stickmanlabs.com
- Element.morph – mir.aculo.us
- AJAX In Place Rich Editor – inplacericheditor.box.re
- Two Colored Slider Demo – aldenta.com
- Gettyone-like search options menu with Scriptaculous – woork.blogspot.com
- Drag and drop to order list elements with Scriptaculous – woork.blogspot.com
- Image Transition Manager – ajaxorized.com
- Sliding Date Picker – ajaxorized.com
- A simple and lightweight prototype-based solution for vertical menu. – spawnrider.net
- Widget.Fader – eternal.co.za
- Ajaxio v0.5 – a simple diagram drawing demo – jameslab.moveable.com
- fake change password form – transparent-message.xilinus.com
- Cool Tips – wildbit.com
- Silly easy shopping – demo.script.aculo.us
- AutoComplete 1.2 Scriptaculous Example – beauscott.com
- Date Slider – ajaxorized.com
- JS Validate – jsvalidate.com
- Slider – wiki.github.com
- Slider Controls with Prototype and Scriptaculous – enriquedelgado.com
- script.aculo.us Sliders – tutorialspoint.com
Hope the above list of references might help you in developing awesome web applications using Scriptaculous










January 20th, 2009 at 9:08 pm
[...] Enlace: 60 stunning scriptaculous applications [...]
January 25th, 2009 at 9:53 am
Really cool site you have!!
January 25th, 2009 at 7:41 pm
kool
January 30th, 2009 at 1:39 am
[...] 60+ Stunning Scriptaculous Applications [...]
January 30th, 2009 at 11:31 am
Great post thanks!
February 5th, 2009 at 2:58 pm
Hi. Your site displays incorrectly in Mozilla, but content excellent! Thank you for your wise words.
February 15th, 2009 at 12:50 pm
Excellent list! A few Scriptaculous gems in there. Thanks very much.
February 16th, 2009 at 4:10 pm
[...] 60+ Stunning Scriptaculous Applications (tags: webdesign tools javascript) [...]
February 16th, 2009 at 9:59 pm
[...] [Original article] Technorati Tags: API, JavaScript, Programming, Script.aculo.us [...]
March 10th, 2009 at 7:51 am
Hello. Great job. I did not expect this. This is a great info. Thanks!
July 17th, 2009 at 7:55 pm
[...] new ideas by looking at these effects. If you couple this with a Javascript animation library like Scriptaculous, you can create some nice graphics without a single image. Remember, though, these languages and [...]
July 29th, 2009 at 12:17 am
great review.. love script.aculo.us love javascript!!!
February 7th, 2010 at 12:17 pm
[...] is very popular, and lots of people have written stuff with it that is available for anyone to use – check out this set of awesome tooltips, for example. [...]