05
May
Posted by
Qandil
as
CSS
Galen Gidman has made a set of 30 CSS3 Progress Bars – each it’s own color. He is offering them as a 100% free download. Those progress bars were using no images what-so-ever… just CSS3. You can use them wherever you like, even in commercial projects.
You can also check out 2 Pure CSS Progress Bars with Animation we mentioned before. I am sure they will be useful when creating web applications.

Published under:
Animation | License Free
bfb4a15d-1404-4645-8dcf-7f75253cff86|2|5.0
28
Apr
Posted by
Qandil
as
jQuery
jRumble is a jQuery plugin that rumbles, vibrates, shakes, and rotates any element you choose. It’s great to use as a hover effect or a way to direct attention to an element. You can control the X, Y, and rotation range, the speed, and event trigger for the rumble.
However, jRumble is currently a little buggy in Internet Explorer. A rumbleSpeed of 0 seems to break the rumble. Also, there is currently no rotation on any objects in IE. This plugin is free to use!

Published under:
Animation | Framework | MIT License
e6ccdb96-d82b-49fe-89d1-98a7c36cea59|0|.0
23
Sep
Posted by
Qandil
as
CSS
1-Pure CSS Progress Bar
Two years ago, we have built a Javascript Progress Bar. Now, would you like a Pure CSS Progress Bar which requires one image for background stripes only? With simple Javascript for animation, it turned into a really simple and slick progress bar which you can use it anywhere on your website.
Pure CSS Progress Bar is best viewed in a Webkit based browser, Chrome is good, also Safari. Opera 10.62 looks quite good. Firefox and IE 9 kind of work (no animations). IE 8, 7 and 6 do not support rounding, shadows or animation.

2-Animated progress bar
CSS Globe has a chic animated progress bar built with CSS and an animated GIF file.
It is simply an EM tag above an animated GIF file which is blocking the part of the GIF file to creating the progress bar stop effect.
As this progress bar is only a visual trick, it can not show a "live" progress but only a static one which the percentage of progress to be shown was defined before the page is loaded.

Published under:
Animation | Best Collections | Inspiration | License Free
d974e072-728f-407d-862a-b4c577f0df64|0|.0
15
Jul
Posted by
Qandil
as
jQuery, CSS
The idea behind the ShineTime is to give your graphics the appearance of being on a glossy surface that have just had a light beam pass over them. This can make them appear to be made of glass and can increase the visual experience your end users see.
ShineTime is useful in making your user interface elements look like they’re a real polaroid photo (or made of glass) and the best part is, it’s not that difficult to achieve.

Published under:
Animation | Gallery
e3a8684b-9082-4cfd-a7f6-fc04b54a9422|1|5.0
06
Jul
Posted by
Qandil
as
jQuery
gameQuery is a jQuery plug-in to help make javascript game development easier by adding some simple game-related classes. It’s still in an early stage of development and may change a lot in future versions. The project has a Google Code page where the SVN repository of the project is hosted and a twitter page where you can follow the daily progress of the development.

Published under:
Animation | Framework | MIT License
779ec5ac-012f-475c-bc33-10eeb38525a2|0|.0
19
Jun
Posted by
Qandil
as
jQuery, CSS
jqDock Transform a set of images into a Mac-like Dock menu, horizontal or vertical, with icons that expand on rollover, and optional labels.

Published under:
Animation | Menu | License Free
68cf0d5f-4487-4173-9a56-7744c157f40e|0|.0
15
Jun
Posted by
Qandil
as
JavaScript
Cloud Carousel is a fast and cross-browser implementation of a 3d carousel – looks very nice, more like a Flash implementation. It can create dynamic reflections underneath the carousel items, is accessible and degrades nicely without JavaScript.
There are some benefits to doing this kind of thing in JavaScript rather than Flash, not least of which is the ease of integration, small file size, SEO, and inherent degradability/accessibility. Not having another dev-tool in the workflow is another plus.
Features:
- Works with most browsers (tested on IE6+, Firefox, Chrome, Opera, Safari).
- Accurate 3d perspective.
- Optional auto reflections - no need to modify your images or add server code.
- Easy integration with basic valid HTML and a tiny bit of JavaScript.
- Small 5Kb (minified) script..
- Degrades gracefully with Javascript turned off.
- Fully accessible with no CSS or text only browsers.
- Works with other plugins, e.g. Slimbox, and preserves your links and mouse events.
- Optional mouse wheel support as of version 1.0.2.
- It's completely free.

Published under:
Animation | Gallery | MIT License
d45a8722-ac49-49d3-bfd6-ff6ee762295d|0|.0
14
Jun
Posted by
Qandil
as
jQuery
In this tutorial: Smooth Vertical or Horizontal Page Scrolling with jQuery we will create a simple smooth scrolling effect with jQuery. We will create a horizontal and a vertical website layout to show the effect. We will be using the jQuery Easing Plugin and just a few lines of jQuery.

Published under:
Animation | License Free
58492a82-d608-4512-a3ce-b053f49f7048|0|.0
12
Jun
Posted by
Qandil
as
jQuery
jqIsoText is plugin for displaying your text with pseudo-isometric effect that will work without any additional CSS, but it can be easily custom styled.
This plugin can be implemented for text nods only.
jqIsoText is compatible and fully tested with Safari 2+, Internet Explorer 6+, Firefox 2+, Google Chrome 3+, Opera 9+.

Published under:
Animation | License Free
bc872dba-7472-4666-a365-8240398be5c0|0|.0
10
Jun
Posted by
Qandil
as
jQuery
Fancy Sliding Form is a fancy sliding form that shows some validation feedback to the user after each step.
Fancy Sliding Form saves a lot of space and is easy to access – it basically works like a slide show, just that we have fieldsets of a form instead of images.

Published under:
Forms | License Free | Validation | Animation
afd3afd4-a6e4-4f56-b3e2-c3cecf2381a8|1|4.0