Giotto - Free Flash Animation Package

Giotto is the package of free flash animation for you in the design, not code. Giotto can relax and focus on the concepts of his creative imagination, the integration of stunning graphics and music into masterpieces of design.

The latest versions of Adobe ® Flash ® are moving away from the designers. Are increasingly oriented coders. With the introduction of ActionScript 3, the creation of a simple action such as clicking on the button now requires ten times more than before coding.

Giotto has full support for ActionScript 2, but we have incorporated into effect generators to help you create outstanding effects without any script at all. This software is for you, designers.

vector drawing, animation, sounds, filters ...

Create complex vector art in Giotto, anything from simple forms to the customs, such as polygons, stars, or a rounded rectangle. Transformation of vector objects in any way imaginable. Using bitmap filters like blur, shadow, brightness, and all blend modes.

Arrange all objects in the library, create symbols, movie clips and buttons for multiple use. Add text fields, with font kerning and paragraph alignment.

Object animation with motion tweens and shape tweens. Adding sound to movies and creating advanced interactivity.

Powerful animated effects without any script at all

Giotto is packed with over 50 great effects that can be applied to both the shapes and text. All effects are fully and easily customizable via the effects editor, and the results are immediately visible on the screen for you to play and explore.

There are over 100 effects presets, new user to show different ways the effects can be adjusted.

These effects are based on ActionScript, but it is not necessary to know the code behind them. Create a perfect ad has never been so easy!

Color Palette Editor that you can use

One of the main advantages of Giotto is the integrated editor palettes. Most of the editors of the color palette that there are pretty useless, but we did Giotto very applicable in real life.

The color palette editor uses special algorithms based on human perception of colors, mathematical models rather than traditional produce bad results.

After selecting the base color of your project, which would have a number of options for creating palettes with many different matching algorithms. This makes the beginning of his new project easy!

Username very similar to Adobe ® Flash ® interface

The animation software change from one to another can be difficult. We do not like learning to fully use new software as much as you do. That's why we created the user interface Giotto very similar to Adobe ® Flash ® and more simplified in order to allow designers to achieve results easier and faster.

Although free, there is no lack of key features, and everything is where it thinks it should be - tools, context menus, properties of objects ... so you have a sense of familiarity and ease of use from the first moment of opening.

We've added some new elements as the editor palette of natural colors, effects generator, and other tools to create stunning effects without having to touch the ActionScript code.

150 best jQuery effects for web designers and developers

Since the arrival of the jQuery library, the life of JavaScript programmers have become much easier because it is now easier to develop Web 2.0 applications. With jQuery, and developers can keep your code organized and concise, which is the main theme of the library, "write less, do more."
You can use jQuery to handle events, create animations, and even add Ajax support in their web applications very easily. Certainly, you can use JavaScript to perform all the functions of jQuery, but if you use it, its programming time to decrease and increase the effectiveness of his will, and that is the true magic of jQuery. In this summary will show you the most captivating and creative tools and effects jQuery inspire you, from animations to presentations, there is a lot of purposes of this article, I hope you enjoy it.

Transition effects
As the name says, these effects are designed to generate animated switches between different elements, from smooth transitions to overlapping animations, here are some of the nicest transition effects made with jQuery:

1. InnerFade

A standard transition effect that always works well when implemented on your designs.

2. jQuery Easing Plugin

You can find an extended list of jQuery effects within this website.

3. HighlightFade

Highlights, rescaling and some other cool effects, 100% jQuery.

4. jQuery Cycle Plugin

You will certainly enjoy the way this transition occurs, it’s difficult to see how it’s executed.

5. Dynamic Page / Replacing Content

An elegant menu with some animated transitions from button to button.

6. Flip

Great transitions made with pure jQuery, it seem like it was made with Flash or something.

7. jQuery Cycle Plugin

Different transition effects to implement on your site.

8. Image Cross Fade Transition

Well transition effect, the screenshot can provide you an idea of how does it work.

9. AviaSlider

Beautiful transitions to implement within a gallery.

10. Creating a fading header

It’s nice to use animation effects on a header, it gives a lot of dynamic to the site.

11. jqFancyTransitions

Lovely transitions that can easily be implemented inside a gallery.

12. jQuery Cycle Plugin – Effects Browser

An extended list of jQuery effects to use with your thumbnails, you can notice some of the effects on the screenshot.
This section covers jQuery effects that are made either for fun or to fancy the appearance of a website, the name says it all, jQuery can make things move!.

13. jQuery Approach

Probably you can  remember yourself doing this in Flash, see it working with pure jQuery is just great.

14. Building an Animated Cartoon Robot with jQuery

Domo arigato Mister Roboto, moving with jQuery sama, this animation effects gathers all the animation basics.

15. Quicksand

You are going to love the quality of this effect, you can create a nice dynamic library with this.

16. Spritely

Here is a clear example of why Flash is in danger, see what came out with pure jQuery.

17. Puffing Smoke Effect in jQuery

Oh Mario, what are you doing here?, this could be a nice idea to create dynamic websites.

18. Crafting an Animated Postcard With jQuery

Great animation effect to use inside a postcard.

19. Glimmer

Another great animation effect for jQuery lovers, you can see how the landscapes moves.

20. Create a Stunning Sliding Door Effect with jQuery

Nice animation effects to use when organizing a new picture gallery.

21. Parallax

Parallax is outstanding, you can play with depth of field with pure jQuery and zero interpolations.

22. Animated Header Background

Subtle movement to give some additional texture to your backgrounds.

23.  Impressive Animated Landscape Header with jQuery

Another prove of the true jQuery’s potential, see how you can manage to move at different speed values a scenario.

24. jQuery UI Animation Effects

Check out this site to find out some interesting jQuery effects that can help you to optimize your site.

25. Animate Curtains Opening with jQuery

We got surprised when we found this, it seems like a Flash animation and it isn’t!.

26. Simple Effects Plugins

Some basic effects that can always help you to stylize a webpage.

27. jQuery Circulate

Another animation using circles and movement, great effect.

28. JavaScript Sprite Animation Using jQuery

You won’t believe that they’re already accomplishing things such as this book effect with pure jQuery.

29. jQuery DJ Hero

If you are a DJ and jQuery lover, you will definitely like this application.

30. jQuery API

You can find a lot of great jQuery effects on this website.

31. jQuery Solar System

This is just great, what a great management of volume and movement.

32. Gravity in jQuery

You can play with the laws of physics, jQuery is just great.

33. Auto-Moving Parallax Background

If you check the demo you will see the background stars moving.

34. Full Cycle of Animation on Hover/Off

Several animations effects made with jQuery, we spend a few minutes playing with these fun bars.

35. jAni

Beautiful animation, it’s hard to believe that this was made without using Flash interpolations.

36. Animate Image Filling Up

Interesting animation that fills an object using jQuery, We’re sure that designers will find a nice use for this.

37. dynamic PNG shadow position & opacity

This jQuery effect can make you spend like ten minutes messing around with the bulb, just great.

38. jQuery Animations: A 7-Step Program

Nice jQuery tips from the guys of NetTuts+, some elegant effects can be found in here.

39. Fun with jQuery’s Animate () function

Just having a little fun with the animate () jQuery function.

40. Easy Sequential Animations in jQuery

Useful jQuery tips for beginners to help them start making their own effects.

41. jQuery 3D Rotator

Similar to tag clouds with a little 3D vibe, interesting jQuery effect.

42. jQuery Faux 3D

By simply placing different boxes one in front of another, you can generate a fancy 3D animation with pure jQuery.

43. Image Flip Using jQuery

You can play with depth of field with jQuery and generate great illusions like this one.

44. 3D Tag Cloud

You don’t need to use photographs or volumetric objects to create depth of field sensations, as you can see on this example.

45. Text with Moving Backgrounds

Great fancy effect, a moving background masked with a text, really nice idea.

46. Image Cube

This effect certainly looks to play with 3D by making a volumetric shape to show a series of pictures.

47. Flip HTML content in 3D

Another 3D implementation with jQuery, very simple.

48. 3D Sphere

Similar to a previous effect of this roundup, on this case we have a moving sphere emulated through the presence of a few elements.

49. Animated 3D Transforms

This jQuery effect works with a mouse-over behavior, so if you roll over one of this cute cartoons, they will react.

50. Smart 3D

Similar to Parallax, this 3D effect with jQuery works great in banners and websites in general.
Text effects
On the old times, text were just system fonts and large contents, but now we have learned that you can do a lot more things with texts. This section covers all type of text effects, from transitions, to stylish customizations, you will find a lot of ways to pimp up your texts with our beloved jQuery.

51. jQuery FontEffect

FontEffect is a jQuery plugin that adds some effects to the HTML texts.

52. jQuery text gradient

A decent attempt to create a text gradient effect in jQuery, For sure that this effect deserves to get featured in here.

53. jQuery label effects

Nice effect series to stylize your text using  jQuery.

54. Fade Colors Using jQuery

Add fading gradients to your text with this pretty jQuery effect.

55. Cross browser text-shadow

A fixed version of this jQuery effect that adds a shadow behind your texts.

56. Grab bag, jQuery text effects

A short list of jQuery effects that works with texts, adding effects to them.

57. jTicker

A nice text effect with jQuery, you can find all the information about it on the original link.

58. Effects jTypeWriter

With this jQuery effect, you can apply different looks to your texts that emulate a typewriter.

59. 3D Flying Text in jQuery

On this site you will find the way to create a flying 3D text effect with jQuery.

60. Airport

If you want to emulate the classic airport’s billboards that have ever-changing texts, this effect does that.

61. Flying Text With Fade Effect

With jQuery you can create nice effects, such as this fading flying text effect.

62. Codename Rainbows

With just a little code knowledge you can get these text effects without even opening Photoshop.

63. Fading color effect

Implementing this jQuery effect will add a subtle gradient to show up every time you roll over a link.

64. Playing with jQuery Color Plugin and Color Animation

On this link you will find how to make colorful menu elements with jQuery.

65. It’s a Rainbow! – Color Changing Text and Backgrounds

Rotate between different color tones whilst displaying a single picture.

66. Font Size Based On Word Count

Depending of the amount of words that your text block possesses, the jQuery effect will establish the proper font size for it.

67. Use the jQuery UI to Control the Size of Your Text

Elegant slider made with jQuery that allows you to adjust the font size of a block text according to your needs.

68. Simple jQuery Text Resizer

Simple but helpful jQuery text resizer to optimize your website’s performance.

69. jQuery Approach

A rollover jQuery effect that makes that every time you place your cursor in front of the text, it changes in terms of color and size.

70. Zooming with jQuery

Simple complement that allows you to zoom a text many times for a better reading.

71. AutoCompleter

Useful jQuery implementation that shows an auto complete box when you’re entering a text.

72. 3D Tag Sphere

Create an elegant 3D tag sphere that works just like a tag cloud.

73. jQuery Word Counter

The previous screenshot shows you a jQuery tool where you can edit the limit of characters within a HTML textarea.
Carousels / Slideshows
This section is about image presentations and the effects that have been made to fulfill that task. Carousels like its name says, are image galleries where you can see the pictures moving all the time. Slideshows are similar than carousels but less 3D and more gallery-like, anyway, they’re both quite similar and that’s why we decided to include them on the same category.
If you want to find more brilliant galleries made with jQuery, visit our article “100 best jQuery image gallery plugins”.

74. Cloud Carousel

Reflections and a natural movement are two of the most relevant aspects of this carousel.

75. Step Carousel Viewer

Nice carousel, although you probably will perceive this more like a slideshow than a carousel.

76. BlogSlideShow

A fancy image viewer to fancy a little your website, it’s done entirely with jQuery.

77. BoxSlider 2.0

Classic slideshow created with jQuery, ideal for implementing on many websites.

78. Slick Auto-Playing Featured Content Slider

Simple slider, functional and easy to adjust to your site’s needs.

79. Simple Controls Gallery

Great picture gallery created with jQuery.

80. CrossSlide

2KB of JavaScript are the essence of this lovely jQuery cross slider.

81. Highslide JS

Easy going jQuery image previewer, you can check the code and adjust it to your site.

82. FancyBox

Quoting their exact words, FancyBox is a tool for displaying images, HTML content and multi-media in a Mac-style “lightbox” that floats on top of web page.

83. Galleria

Nice gallery that you can use anytime on your site, specially on minimalistic places.

84. Polaroid Photo Viewer

Injecting jQuery into your web designs can help you make things like this Polaroid photo viewer.

85. Sliding Boxes and Captions

A basic idea with a great result, just playing with boxes and animations to generate this gallery.

86. ImageFlow

A friendly gallery developed with jQuery, works in a very elegant way.

87. Image Rotator with Preview

You will find quite amusing the images that these guys used making this image gallery.

88. Coin Slider

Great jQuery gallery, fabulous effects and transitions.

90. Revealing Photo Slider

Useful jQuery image slider, it’s interesting the way the images react to the mouse click.

91. BBC Radio 1 Zoom Tabs

Inspired on the latest BBC Radio 1 website, we find this jQuery effect that can be used as a gallery.

92. Leopard Dashboard

Great Mac emulation with jQuery, these are the kind of thins that can make you love jQuery.

93. Z-Index and jQuery

On this effect made with jQuery, you will learn how to make a pile of pictures that work as a gallery.

94. Contextual Slideout Tips With jQuery & CSS3

An easy way to create some nice contextual slideouts with jQuery.

95. Zoomer Gallery


Pure Flash style, zero ActionScript, 100 % jQuery, this gallery works with a rollover effect that increases the picture’s size when highlighting it.

96. Advanced background slideshow

Full size background slider, a good way to place more than just a generic photograph.

97. Panning Slideshow

If you select the proper pictures, you will have in your hands a gorgeous slideshow.

98. Sliding Login Panel

Many developers can remember themselves doing a similar panel a few years ago on ActionScript and well, it’s  good to find it on jQuery.

99. Beautiful Background Image Navigation with jQuery

Astounding navigation system, it’s brilliant the treatment given to the image transitions.

100. iCarousel

Elegant jQuery carousel to display a series of pictures in a very clean way.

101. Awesome Bubble Navigation

Brilliant navigation system, it shows a different way of developing a site’s navigation. For sure it’s a great way to take advantage of jQuery.

102. Semitransparent Rollovers

An easy way to create a subtle translucent rollover effect with jQuery.

103. Spacegallery

A nice way to use jQuery, very tech-like gallery, ideal for tech and engineering applications.

104. Morphing Gallery

Pretty cool, it’s a different way of using jQuery on developing a gallery.

105. Pikachoose

There’s no Pikachu like you think after reading the title, only a fancy jQuery gallery.
Image Edition
This category gathers all the jQuery effects that are designed for editing images, effects such as cropping or rescaling are included on this part of the showcase, probably you will find more than one of this effects quite useful.

106. Crop Example

Useful jQuery effect that lets you crop an image to make the adjustments that you consider necessary.

107. jQuery Demo: Creating a Sliding Image Puzzle

If you want to have some fun, you should take a look at this amusing jQuery effect.

108. jCrop

Similar to the Photoshop’s crop, this is certainly an useful jQuery tool.

109. jQZoom

You can make a nice jQuery zoom just like the one on the previous screenshot, it offers different ways of zooming in and out.

110. jQuery Virtual Tour

An extension to Single Panorama Viewer, which is a great jQuery effect to take 360 degrees observations.

111. AnythingZoomer

You can zoom in over anything, from texts to images to check out all the little details.

112. ImgAreaSelect

Simple image area selector with jQuery, it shows you the coordinates and dimensions of the selection.

113. PanView

Hold down your mouse and start navigating across an image.

114. Rounded Images

A nice way to stylize your pictures with jQuery by giving them  nice rounded corners.

115. jQuery Corner Demo

There’s more than one way of using rounded corners, as you can see on the previous screenshot.

116. PNG Overlay

A good way to fancy your images so they can get a good looking overlay vibe.

117. jQuery for Background

Insert an animated background to your buttons with jQuery.

118. Resizeable Background Image

The name says it all, a resizable background image with jQuery.

119. Circular Motion Effect

Nice circle series that together create a pretty cool navigation system.

120. Photo Zoom Out Effect

Great jQuery gallery, not just a simple slider, it plays with proportions whilst rolling over.

121. Photoshoot Effect

Using jQuery you can obtain fabulous effects such as this amazing photoshoot effect.

122. Interactive Picture

With this tool you can add interactivity to an image via jQuery, ideal for making descriptions of elements within a picture.

122. Cloud Zoom

Great cloud zoom effects, you will definitely love the glow effect used on this jQuery effect.

123. Apple-like retina effect

For those who are familiar with the Apple products, you will enjoy this jQuery effect.

124. Micro Image Gallery

Clean and elegant jQuery gallery, ideal for implementing on minimalistic websites.

125. Image Highlighting and Preview

Nice way of highlighting pictures within a document.

126. Image splitting effect

Very simple effect that can be used along with galleries and stuff.

127. ImjQMosaic

jQuery implemented as a highlighter tool in a mosaic style.

128. URL Screenshot Preview

With this tool you can show a preview to any URL after a rollover in front of a hyperlink.
Utilities and Extras
This part covers those jQuery effects and tools that did not fit on any of the previous categories, you will find some pretty interesting things on this final section of the showcase, enjoy it.

129. ColorPicker

It’s always useful to have a color selector at the reach of your hands, maybe you want to keep this under your selections.

130. Rotating Billboard System

You can use this great effect on your site instead of a slideshow and without a single line of ActionScript.

131. jQuery Rotate

If you’re not happy with having straight grid and straight pictures, then you can use this jQuery effect to fix it.

132. The Sexy Curls

Beautiful jQuery effect to see the truth behind a website, which means seeing the code behind the design.

133. Simple Tooltips

Create little tool tips to add to your website’s elements with this jQuery tool.

134. Rezoner’s jEffects

I know that this one may fit on the galleries section, but because of its quality we moved it here.

135. jQuery Touchwipe

Obtain wipe gesture from touch screens, works with iPhone, iPad, iPod touch and Android.

136. Image Blur

This one could be inside the images area, but we think that it’s a pretty cool effect and deserves to be considered as unique.

137. Before / After

Great jQuery plugin to make comparisons, such as the one shown on the screenshot.

138. Music player with mouse gestures

A jQuery effect that will improve the interactivity of your websites by the using of click and drag properties.

139. Greyscale Hover Effect

Lovely hover effect that turns everything to a greyscale when rolling over.

140. Tetris with jQuery

Well what can we say about this one?, you will definitely have a lot of fun with this.

141. jQTwitter

If you need to add a Twitter box to your site, jQuery offers this nice solution for you.

142. jQuery Animation Plugin

An easy and effective way to set an image scale with a simple jQuery syntax.

143. jQuery easing animation

Similar to Flash’s McTween, this jQuery series has been made to help you make amazing animations.

144. Background Position Effect

Quote: Adds the ability to do background-position animations from  jQuery 1.2, and newer.

145. jQuery Bounce Page

A bouncing box where you can place text and animate it.

146. CanvasSwap

If you need to save space but still show a lot of pictures, you might want to check this jQuery tool.

147. Several jQuery Animations

A large list of jQuery animations developed by the people of Tutorialized for you to check out.

148. jScratchcard

Pretty cool, it emulates a scratch card, like the classic lotto tickets you buy on the market.

149. jQuery Flight Board

Similar to an effect that we showed you before, this is definitely a great idea.

150. Dock and Stack

And the final effect is a nice recreation of the Mac desk, which is something that many people really like. OK guys, that was it for this countdown, some of the nicest and most useful jQuery effects that are ready to give you a hand when developing your own projects, let us know your opinion and tell us about additional effects that we did not include on our showcase, see you next time.