Learn and share. The simplest harmony.

 

Flyout Image Slider Using jQuery & CSS3

Posted on July 25, 2012 and got 8 shouts so far

In this post I’m going to share about how to create an experimental flyout image slider. This image slider is a stack of some images and works by flying out the selected image to the front of images stack. We will use CSS3 transition, animation and transform for this animation and jQuery for helping us maintain click event, CSS transition and animation.

 

Mini Collection for Prefix & Postfix Input Form

Posted on July 9, 2012 and got 11 shouts so far

On developing an application sometimes I need an instant library for prefixing and postfixing an input field on a form, I don’t have one so I decided to make it to be used on future project. This library using Font Awesome for the icons of the prefix and postfix, go through the post to see the sets.

 

Portfolio Flipping Slider Using jQuery & CSS3

Posted on July 3, 2012 and got 10 shouts so far

There are many ways on displaying our portfolio, one of them is using grid style with slider effect for pagination. In this tutorial I’m going to share about how to displaying our portfolio grid with flipping slider effect for pagination using jQuery & CSS3 Transform.

 

Showcase Product Feature in 3D Style

Posted on June 24, 2012 and got 4 shouts so far

Focus on showcasing our product features can be a good choice for attracting user on landing pages. By showcasing in 3D style also a good choice, in this tutorial I am going to share how to showcase our product feature in 3D style using CSS3 3D Transform and jQuery.

 

CSS3 Pictogram Button

Posted on May 29, 2012 and got 48 shouts so far

If you follow my previous post about how to use pictogram for replacing image you must be familiar with this freebie I want to share. This is a set of 43 button with three different styles and six different colors and using entypo pictogram for replacing the images. Go through the post to see the entire sets.

 

Showing Image With Bounce Effect

Posted on May 24, 2012 and got 4 shouts so far

There are many example out there that using CSS3 transform and animation for enhancing the webpage and today I’m going to share one of them. Using CSS3 transform and animation we will create a bouncing effect when an item (in this case image) is showing or added to our webpage.

 

Creating Android Dock Using jQuery & CSS3

Posted on May 5, 2012 and got 8 shouts so far

When playing the Galaxy Tab I love the fanciness of its Android’s dock. The application icon will pop out consecutively when arrow image on the dock clicked and not just the icon beautifully animated the dock itself also rotating vertically with 3D style. In this tutorial we’re going to create them using jQuery and CSS3.

 

Showing Product Information With CSS3 3D Transform

Posted on April 26, 2012 and got 25 shouts so far

There are many ways on showing product information, for example when hover the product image, the product information is sliding above or even using pop up. In this tutorial I’m going to share how to show our product information with cube style using CSS3 3D Transform.