In today’s multimedia web it’s becoming an ever increasing part of web design to include videos. Customizing the video player is one of the first things web designers think about when implementing these elements, as often the default player does not match the website, or merely for consistency across browsers and devices. In this tutorial we’re going to be going…
Using previously existing CSS techniques as well as new CSS3 ones, we’re going to create a pretty cool CSS only image slider with arrows and 3D transforms. To do this we’re going to use a few CSS tricks which will allow you to accomplish this. Setting up the HTML I’m sure very few people have trouble understand the core tenets…
In part 1 of this guide we covered all the basics from implementation structure to more advanced things such use tags. In this part we’re going to expand upon what we already know, as well as look at some of the more interesting features that SVG has. This article is part of a series! If you want to stay up…
SVG (Scalable Vector Graphics) is a very useful tool for drawing shapes and figures with simple code. It is probably one of the most useful tools that web designers are hesitant to use, although once you understand it, you’ll wonder how you lived without it! In this series we’ll be going through the basics of SVG, including how to use…
Recently the ‘flip book’ effect has become really popular on a lot of websites, so I got to thinking about how you could go about pulling off that effect using some jQuery and CSS3. I find that most of the implementations of this code can get a little bit complicated, so I tried to make things as simple as possible.…
Over the past few days I’ve been messing around with transitions and transforms and managed to come up with this little menu. It incorporates a bunch of different CSS techniques, but is very experimental! The original idea was to have a button you pressed, which then launched a secondary ring to pop out which contained the menu items. Read on…
I decided to spend yesterday attempting to create this slide in background effect. Through frustration and a bit of effort I managed to accomplish it! In this tutorial I’ll give you a quick run down of how to go about creating this slide in effect. What we Want There are a few things we want to accomplish. The code I…
In CSS we have many ways to style things in any way we want. When it gets to forms though, things get a little complicated. Text inputs are easy, but checkboxes and radio buttons are very difficult to style with CSS. In this tutorial I’ll show you exactly how to style these inputs and make awesome forms with just CSS!
The HTML5 canvas element allows for developers to implement interactivity and drawing which was previously undoable without the use of a third party program such as flash. In this article we’re going to be tackling the problem of interactivity, and how to accomplish it using HTML5′s canvas tag. You could expand upon this information to make a basic HTML5 game.