RickyH - Web Design, Web Development, Javascript, CSS, HTML5, MooTools

Mar 2010

Flipping Crazy – CSS3

7th Mar 2010

This is a pseudo way to flip HTML elements on their backs. This is a way of doing it now without waiting for a possible introduction of 3D Transforms from webkit. Try the demo or reading the post to found out how it was done:

Space carousel

View Demo

Read More

Jan 2010

Fun with CSS3 and mootools

31st Jan 2010

These examples came about when experimenting with the extend property in MooTools. By extending the styles class I could add CSS3 properties into the Core MooTools framework and do CSS3 animations.

Space carousel

View Demo

Read More

New Site – PH Engineering Limited

27th Jan 2010

A new website design for PH Engineering Limited. The site is a simple clean design incorporating some clever JavaScript and stylish CSS. This was the companies first website and I was pleased to get offered Creative Control on this project.

Space carousel

Visit Site

Read More

Dec 2009

rotate360 (Image rotation in javascript)

17th Dec 2009

This is an example of image rotation and control using CSS sprites and JavaScript. The example i went for is based on a product demo by apple for the Ipod touch. There example uses Quicktime but i thought is was possible in JavaScript so i gave it a go.

Space carousel

View Demo

Read More

Nov 2009

Spacegallery – mooStyle

23rd Nov 2009

I was combing the JavaScript framework blogs and came across this image carousel in JQuery: SpaceGallery. I used this same concept in my old website but it was written in mootools. The jQuery plug-in feels unresponsive and slow and doesn’t have any features. So here is the mootools version i wrote, sorry is not as a plugin but feel free to make it into one.

Space carousel

View Demo

Read More

CSS: Position-x and Position-y

8th Nov 2009

While building out a content management system for DMP I needed to create a toolbar which would stay with position: fixed; on the y-axis, but act like position: absolute on the x-axis. To achieve this I used a clever JavaScript class from David Walsh called scrollspy. View the example below to see it in action.

Position-x: Position-y:

View Demo

Read More

Oct 2009

RickyH – Halloween Logo

31st Oct 2009

So its Halloween again and to celebrate I decided to create a new logo. I have to begin by apologizing to people using Internet Explorer because the Logo simply won’t work; this is partially to do with me being too lazy to port it over and partly because IE stinks and doesn’t support the CANVAS element.

New Design Of RickyH.co.uk

Read More

RickyH new blog design/concept

24th Oct 2009

I was wanting to do something different and new with blog-design. I’ve created word-press templates before but they all follow the same format: the new design concept incorporates some new technologies such as HTML5 and some clever JavaScript scripts written by myself and the wonderful MooTools community.

New Design Of RickyH.co.uk

Read More

The blog begins - and now for something completely different.