Colour hover for colour lovers

Have you ever spent hours trying to decide on an accent colour for hovers or other effects on your website? Yes? Me too. I am a colour lover at heart. Well, now you don’t have to choose. Have ALL TEH COLOURS. Learn how in my new CodePen. Each time a list item is hovered it is highlighted by a different colour.

Here’s a brief look at what’s happening. In the HTML I’ve built a regular navigation list. In the CSS I’ve made it all nice and inline. I’ve also set the classes for my 5 accent colours, pulled from the nice people at Pantone, as well as black as the default background colour. In the jQuery I’ve set up a Math object to randomize the colours. I’ve used a ‘this’ keyword in order to have the colour classes added and removed on hover.

How do you incorporate colours in your sites? Are you a colour lover?

Tags: , , , , , ,

Categorised in:

This post was written by Vanessa Merritt

Leave a Reply

Your email address will not be published. Required fields are marked *