16 Astounding CSS3 Transitions Effects

16 Astounding CSS3 Transitions Effects

CSS3 Transitions Effects now a days is very popular for designer and developer. It allows our html elements to animate in browser by changing the css properties. As we all know most of the latest browser today is supported by CSS3 oh well with regards to Internet Explorer hahaha.. maybe yes, sometimes no?. Anyways, using the CSS3 Transitions Effects it minimize the used of javascript in our webpages.

The main benifits using CSS3, we can transform our static webpage to more interactive and more user friendly because the user can interact with our website without using a server side scripting, or javascript. We can do some presentation by using CSS3 and that’s awesome. :)

So right now, we have 16 Astounding CSS3 Transitions Effects that you might want to check so you can used it for your next project. SHARE IT GUYS and Have Fun using CSS3.

Continue reading…

HTML5 & jQuery Progress bar plugin : Percentage Loader - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love



From our last post, we round-up 20 List of Smashing Photoshop Progressbar PSD Template For Free that you should check out if you didn’t see it. So for today’s post, we will list the best and functional progress bar that you can easily incorporate with your blogs or website. This loading / progress bar has different style among others. I know you should love this awesome round up. Check this cool 15 Groovy Loading And Progress Bar CSS3/JQuery Plugins You Should Love, Do you think you might need it? Then Grab It and Share It:)

[box type=”note” align=”aligncenter” width=”600″ ] [/box]

1). HTML5 & jQuery Progress bar plugin : Percentage Loader

A tiny jQuery plugin for displaying progress in a visual and engaging way.

HTML5 & jQuery Progress bar plugin : Percentage Loader - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

HTML5 & jQuery Progress bar plugin : Percentage Loader – 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

2). Sonic Progress Bar Plugins

Sonic is a tool that you can use to create spinny-loady-thingies on the fly. It’s best for shapes that loop.

Sonic Progress Bar Plugins - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

Sonic Progress Bar Plugins - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

3). CProgress Bar Plugins

jQuery circular progress bar.

CProgress Bar Plugins - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

CProgress Bar Plugins - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

4). Jquery Spin.js

An animated CSS3 loading spinner.

Jquery Spin.js - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

Jquery Spin.js - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

5). CSS3 Loading Animation Loop

Three CSS3 animation loop and can be used in preloader for images with jQuery.

CSS3 Loading Animation Loop - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

CSS3 Loading Animation Loop - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

6). The Facebook Loading Animation

Facebook loading animation using CSS3 animations.

The Facebook Loading Animation - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

The Facebook Loading Animation - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

7). Flickr Style Loading Animation Using JQuery

A Flickr like loading animation.

Flickr Style Loading Animation Using JQuery - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

Flickr Style Loading Animation Using JQuery - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

8). CSS3 Loading Spinners Without Images

Create animated image-less loading spinners such as used in a lot of webapps

CSS3 Loading Spinners Without Images - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

CSS3 Loading Spinners Without Images - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

9). Bouncy Animated Loading Animation

A loading animation fron Chris Coyier

Bouncy Animated Loading Animation - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

Bouncy Animated Loading Animation - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

10). QueryLoader2 Preloading

QueryLoader2 is simply scanning the given elements for images (and background images) and preloading them before the website is visible.

QueryLoader2 Preloading - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

QueryLoader2 Preloading - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

11). CSS3 And JQuery Progress Bar

A fancy progress bar using CSS3 and jQuery, but no Flash or even images.

CSS3 And JQuery Progress Bar - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

CSS3 And JQuery Progress Bar - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

12). jQuery High Quality Loader

Bestloader is a plugin for jQuery that lets you to have an high quality loader. This is possible because this isn t a gif image, but it s an animated png. Bestloader supports high resolution display, like retina display

jQuery High Quality Loader - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

jQuery High Quality Loader - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

13). Advanced Progress Loader

Advanced Progress Loader is fully customizable loader and supports all major browsers.You can easily change radius,thickness,size,speed etc.See the demo.

Advanced Progress Loader - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

Advanced Progress Loader - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

14). PageLoading jQuery Plugin

This jQuery plugin that will allow you to show a loading view during the loading of a web page.You will be able in a row and some parameters to customize the loading view. It s colors, loader icon, the background image of the loading view.

PageLoading   jQuery Plugin - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

PageLoading jQuery Plugin - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

15). Ajax Style Loading Animation in CSS3 ( no Images )

Tutorial for creating Ajax style Loading Animation using pure CSS3

Ajax Style Loading Animation in CSS3 ( no Images ) - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love

Ajax Style Loading Animation in CSS3 ( no Images ) - 15 Groovy Loading and Progress Bar CSS3/JQuery Plugins You Should Love