60+ Stunning Scriptaculous Applications

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.

Scriptaculous slider trick

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.

Lightbox++

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

Scriptaculous Effects Demo

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.

LightWindow v2.0

• 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!

Read More…

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