Some day agos, jsB@nk presented to you a cool list of awesome, unique web experiments based on CSS3 via Beautiful and Stunning CSS3 Animation Experiments, and today in this JavaScript article, jsB@nk keep showing you a list of other 50+ web applications, JavaScript experiments that built on CSS3 technology; especially, we have full completed tutorials to create these stunning CSS3 experiments by yourself. Some names you will be excited: Sexy Vertical Sliding Panel, Awesome Overlays with CSS3, 3D Ribbons, Beautiful Looking Custom Dialog Box, Halftone Navigation Menu, Coverflow With CSS Transforms, 3D CSS Transforms, Taggify, AmberJack, SimpleModal, jQuery Masonry, WebKit Clock, Microsoft Office Minibar.

Please go to the inner post-page to view full list of these 50+ awesome CSS3 experiments/applications. And see more cool web-based applications below:
- Showcases of Awesome Designs with Stunning JavaScript
- 50+ Great Web Applications of Data Visualization

• Demo
• Enlarge
• Reload
• New window

Going Nuts with CSS Transitions

You will learn how CSS 3 transforms and WebKit transitions can add zing to the way you present images on your site.

Sliding Vinyl with CSS3

We take a standard album cover, a little HTML, and some CSS3 transitions and transforms to create a sliding vinyl effect for showing off the music you love.

Fun with CSS3 and Mootols

These examples came about when experimenting with the extend property in MooTools. By extending the styles class I could add CSS3 properties into the Core MooTools framework and do CSS3 animations.

Fun with 3D CSS and video

Zach Johnson has been having fun with 3D effects via CSS such as his isocube above, which is brought to you with simple HTML (including a video tag for a playing video on the surface!) and some CSS.

CSS Animations

No matter how fast internet tubes or servers are, we’ll always need spinners to indicate something’s happening behind the scenes.

3D Cube using new CSS transformations

The impression of a three dimensional cube can be created using modern CSS techniques, without the need for JavaScript, imagery, canvas or SVG. Using the proprietary transform property to skew and rotate shaded rectangles, individual cube faces can combine to form a 3D object.

More on 3D CSS Transforms

The author will show you what 3D CSS Transforms can do.

How To Create a Pure CSS Polaroid Photo Gallery

Magical things can be done by combining various CSS properties, especially when some of the new CSS3 tricks are thrown into the mix. Let’s take a look at building a cool looking stack of Polaroid photos with pure CSS styling.

An Awesome CSS3 Lightbox Gallery With jQuery

In this tutorial we are going to create an awesome image gallery which leverages the latest CSS3 and jQuery techniques. The script will be able to scan a folder of images on your web server and build a complete drag and drop lighbox gallery around it.

Editable CSS3 Image Gallery

We build a pretty typical image gallery design pattern, a grid of images that pop up larger when clicked. But this image gallery page makes use of hot semantic HTML5 markup, loads of visual treats with CSS3 and jQuery, and made editable through the CMS PageLime. Quick reminder, the demo is awesome-est in a WebKit browser (Safari or Chrome).

• Code
• Print

• Comment (0)
• Write

by Preview

Cancel reply

Write your comment

Comments of Guest will be previwed before published
Give your real email to get notifying replies, or comment will be deleted

Your name *
Your email^g *
Your site

Comment's title

I assure 100% I am real human
I repeat I am not bot

• Sent (0)
• New