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

If you know how to use CSS and Javascript, you can create some impressive websites. Not only that you can do some awesome stuff with them but they also ease you work. In this article you have 100 awesome CSS and Javascript plugins and coding techniques that should definitely be in you toolbox.

Use CSS3 to Create a Dynamic Stack of Index Cards

You will learn how to create a dynamic stack of index cards solely with HTML and CSS3 and use such CSS3 features as transform and transition (for the dynamic effects) and @font-face, box-shadow and border-radius (for the styling).

Dynamic PNG shadow position & opacity

You will learn how to create a movable object using javascript.

How To Create A Sexy Vertical Sliding Panel Using jQuery And CSS3

So, what about a vertical sliding panel that would act as some sort of drawer instead of the usual top horizontal sliding panel that pushes everything else down when it opens? While thinking of alternatives to the usual horizontal panels, the author thought it would be nice to create something that works in a similar way, but that is a bit more flexible.

Awesome Overlays with CSS3

The trick with these overlays is the gradient border, going form a lighter to darker orange as you go from top to bottom. To create that effect we used to the border-image property, which is a tricky little addition to CSS.

How To Create Depth And Nice 3D Ribbons Only Using CSS3

We will use box-shadow to create a drop-shadow with RGBa, a color model that allows an optimized contrast with any kind of backgrounds. RGBa is the standard RGB model (0,0,0 � 255,255,255) and it adds the last option (a) for the opacity. We can use this model also for other properties and it works with the new browser.

Create a Beautiful Looking Custom Dialog Box With jQuery and CSS3

This custom dialog box is one of the scripts in that website and I think it will be quite useful for all of us. The reason I have this custom dialog box is to overcome the inconsistencies across different browsers. And, of course, it uses CSS3 to style everything.

Sweet AJAX Tabs With jQuery 1.4 & CSS3

Organizing the content of a page in a both intuitive and eye-catching manner, is a must in modern web design. One principle that has been around for some time is dividing text into tabs. This allows you to squeeze much more content in a seemingly limited space and provide a structured way of accessing it.

Sweet tabbed navigation bar using CSS3

Although I don�t understand why animations have been added in CSS3, this upcoming standard does have a couple of very neat features added to the CSS we�re using today. I wanted to take a couple of these new things, and create a Sweet tabbed navigation using CSS3.

Halftone Navigation Menu With jQuery & CSS3

You will learn to make a CSS3 & jQuery halftone-style navigation menu, which will allow you to display animated halftone-style shapes in accordance with the navigation links, and will provide a simple editor for creating additional shapes as well.

Building Coverflow With CSS Transforms

You will learn how to create a coverflow effect that actually flows and animates in real-time, without using canvas or prerendered graphics.

• 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