Category Coding

How to Create Responsive Pure CSS Tabs

In this tutorial I’m going to show you how to create Responsive Pure CSS Tabs. We’ll be using Font-Awesome to add icons to the tab labels, so we can hide the text label and leave only the icons on smaller…

Pure CSS Tooltips with HTML5 Data Attribute

The HTML5 data attribute can be used for a lot of things. For example as selectors in jQuery, setting values for a jQuery application and so on. In this tutorial we’re going to take a look at how can we…

CSS Animation Basics: Creating a CSS Loader

In this article, we’re going to take a look at some css animation basics. How it works, what it is, and then we’ll create a simple css loading animation, similar to facebook’s chat loading animation. In a previous article, I’ve…

Get HTML5 Data Attribute with jQuery

In this tutorial we’ll be taking a look at how to get HTML5 data attribute with jQuery. We’ll create an anchor tag and turn it into a button with  CSS. Then we’ll add two data attributes on it. One for changing…

Create an Exit Intent Popup Window

In this tutorial we’re going to create an exit intent popup window. First, we’ll talk about what exit intent is, then I’ll walk your through the steps of creating the popup window, then we’ll create the exit intent script. We’re going…

Using HTML5 Data Attribute as Selectors in jQuery

HTML5 Data Attribute as Selectors in jQuery

When we’re create a jQuery application, most of the time we use CSS Classes or IDs to select specific HTML elements on the page and do things with them. But what happens if we give the application to an other…

Animated Scroll to Top with jQuery

In this tutorial we’re going to take a look at the creation of an animated scroll to top with jQuery. As the name says, we’ll be create a button, that appears in the bottom right corner after the visitor starts…

Pure CSS Off Canvas Navigation Menu

In today’s tutorial, we’re going to take a look at the creation of a CSS off canvas navigation menu. First off, what is an off-canvas navigation menu. It’s a menu that is hidden/pushed aside from the screen, so it’s not…