Advertise here

Tutorials

Multi Step Form with Progress Bar using jQuery and CSS3

August 26, 2015     5290     Form Elements
Multi Step Form with Progress Bar using jQuery and CSS3

A tutorial about creating Multi Step Form with Progress Bar using jQuery and CSS3. You can change your classic long forms into smaller logical sections and convert it into a multi-step form with a cool progress bar. Could work for lengthy processes like registration, checkout, profile fillups, 2-factor authentication logins, etc.

Read More »

Bootstrap and jQuery Checkbox

August 22, 2015     2860     Form Elements Bootstrap
Bootstrap and jQuery Checkbox

A simple way to create a Bootstrap styled checkbox using jQuery. Just set the text input to be a hidden field or any other field type that fits your project needs.

Read More »

Animated SVG Hero Slider

August 17, 2015     4535     Slider Effects Animation
Animated SVG Hero Slider

A tutorial about creating full page slider, with animated SVG elements used as transition effects.

Read More »

Quick Add To Cart with CSS and jQuery

August 06, 2015     3149     Others
Quick Add To Cart with CSS and jQuery

A tutorial about creating handy snippet to let let users customize a product directly from the products gallery, and add it to the cart.

Read More »

Zoom Slider – Content Slider with Depth-Like Zoom Functionality

July 07, 2015     4524     Slider Zoom
Zoom Slider – Content Slider with Depth-Like Zoom Functionality

Zoom Slider is a simple content slider with depth-like zoom functionality.

Each slide has a predefined zoom area that will be used to calculate the appropriate scale value for a fullscreen fill. Once the icon for zooming is clicked, the zoom area as well as the page get scaled, creating the illusion that the viewer is approaching the item

Read More »

2 Blocks Template

July 02, 2015     2493     Slider
2 Blocks Template

A template split in 2 animated blocks of content. On bigger devices, the content is split in two main containers. When the user surfs through the content using the navigation, new content overlaps the old one. On smaller devices, we have a simple gallery of projects, with a slide-in panel containing additional project information.

Read More »

Responsive Layered Slider

June 19, 2015     3609     Slider Responsive
Responsive Layered Slider

In this tutorial you will lean how to create a responsive layered slider. The slider will have multiple slides, each slide will have multiple layers which can have a different fade in effect.

Read More »

Page Scroll Effects

June 11, 2015     5606     Scroll Effects
Page Scroll Effects

A tutorial about creating experimental page scroll effects. All animations have been created using Velocity.js.

Read More »

Color Extraction Effect with CSS Filters and Javascript

June 04, 2015     1177     CSS3 & CSS
Color Extraction Effect with  CSS Filters and Javascript

A little slideshow with a color palette creation effect using CSS Filters and Vibrant.js. The idea is to create a color palette from an image with a subtle effect on the image itself and some fanciness on the palette

Read More »

Product Tour

June 03, 2015     2768     Others
Product Tour

Product Tour is a responsive tour snippet, with a step-by-step guide to help users understand how to use your website.

Read More »

Mega Dropdown with CSS and jQuery

May 28, 2015     15119     Menu
Mega Dropdown with CSS and jQuery

A tutorial about creating responsive and easy to customise mega-dropdown component by using CSS and jQuery.

Read More »

Product Comparison Layout & Effect

May 26, 2015     3759     CSS3 & CSS Effects
Product Comparison Layout & Effect

A basic responsive product grid layout with comparison functionality and a slide-in effect.

Read More »

Animated Page Transition

May 21, 2015     4713     CSS3 & CSS Animation
Animated Page Transition

A CSS powered animation, that replaces the refresh of the page while the content is updated using Ajax.

Read More »

Responsive Photo Gallery with Bootstrap

May 07, 2015     7506     Gallery Responsive Bootstrap
Responsive Photo Gallery with Bootstrap

A tutorial about creating responsive photo gallery by using Bootstrap.

Read More »

CSS3 Progress Bar with jQuery

April 13, 2015     2801     CSS3 & CSS Animation
CSS3 Progress Bar with jQuery

A tutorial on how to write a CSS3 progress bar and add some cool animation, along with a jQuery counter.

Read More »