Posts by SauravRoy

SauravRoy

Making an Awesome (and Animated) menu with just CSS!

January 16, 2012 at 6:00 pm By

In this tutorial we’re going to making a pretty menu that utilizes CSS transitions to give the impression, almost, of a bar filling with colour. After hovering off the menu item the colour will then move back down, emptying the bar and leaving a 6 pixel border on the left. It’ll be incredibly fascinating!

CSS Animation! Making The Mac OSX Dock Fan

January 13, 2012 at 6:00 pm By

In this tutorial we’re going to be creating a Mac OSX fan effect in just CSS3, using no Javascript. We’re going to accomplish this by just using animations and transitions, so read on to find out more!

Clicking Through an HTML Element With Pointer Events

January 12, 2012 at 6:00 pm By

Can’t Click! This is a problem I’ve ran into quite a lot. Sometimes a semi transparent or transparent element will be on top of a link or button, something I want to be able to click on. Unfortunately, normally you can’t click on something if its below something else. Unless you add this to the CSS for the transparent element:…

The Definitive Guide to CSS Animations and Transitions

January 11, 2012 at 4:00 pm By

Animations and transitions are perhaps one of the few CSS features that is gaining the mainstream consensus that they are required for day to day use, and it there is certainly good thinking behind this. Both have added what could only previously be done with Javascript, and made web deceloper’s lives easier in the process!

Website Trends: 15 Websites That Make Great Use of Typography

January 9, 2012 at 6:00 pm By

Typography is perhaps one of the most beautiful aspects of a website. The wrong typography can leave a website feeling drab and boring, whereas picking the right fonts can imbue a website with a new sense of life where it may not have existed before. The websites below manage to master that technique, and provide us with beautiful headlines and introductions.

12 Pretty Amazing Free Serif Fonts

October 4, 2011 at 12:21 pm By

Serif fonts promote style above everything else. Here’s a list of 20 pretty amazing, and free serif fonts for you to add to your library. Hopefully you’ll find something that you like below.

Making a Flip Card with CSS3 Transforms with Transitions

September 26, 2011 at 3:08 pm By

It’s so much easier with CSS CSS3 is quickly becoming a replacement for a lot of things Javascript was the only viable option for. The 3D transform effects are amongst the things that at one point would’ve been thought impossible without some sort of hard coding. Support Obviously, support is what’s important here. Currently the only support is in IE…

Stop jQuery Repeating on Multiple Instances

September 4, 2011 at 7:55 pm By

I’ll often run into this problem in jQuery where if you hover on and off something too many times it’ll repeat the action over and over again. Here’s some example code for an image that you can only partially see, and then which slides down on hover. If you were to leave it like this then if the user hovered…

jQuery 3D Parallax Scroll Effect

August 30, 2011 at 9:18 pm By

Parallax Scrolling Okay, so you might remember a bit earlier this month I made a post on a Parallax effect using images and mouse movements. However working recently on a theme for wordpress, which I hope to share with you guys eventually, I managed to create a pretty cool plugin for making 3D Parallax Effects when scrolling. I haven’t done…

Making Your Website Faster

August 25, 2011 at 7:53 pm By

An Introduction to Speed HTTP Requests A web browser, just like the one you’re using now, uses HTTP requests to load a webpage. The absolute minimum number of HTTP requests a page can make is 1. That would be, requesting the page you’re on assuming it doesn’t include any other files. Cache Making an HTTP request takes a bit of…