SuperHi Video

How to make a background gradient rotate

On Rik's website, the background of the whole page rotates very subtly. We can't do this with Javascript as gradients are background images so we show you how to fake it with Javascript.

4:38

The ustwo background changing hover effect

This week, we look at how to make other parts of the page change on hover. With CSS we can only change the tag or inside the tag on hover, but with a bit of Javascript, we can change completely different parts of the page.

17:29

Playground Paris colorful text hover effect

The new site from Playground Paris has a really nice hover effect on its text. We wanted to show how it was done.

7:46

The revealing footer effect

The revealing footer effect is seen on quite a few websites, such as Pitchfork. It's an easy technique to add to your own site using CSS's fixed positioning.

11:08

Git and Github

A few people have heard of Git and Github but don't really know how they work and what they do. Lawrence and Rik go over an introduction to both of them.

16:09

The parallax effect

On the Firewatch website, there's a lot of layers that scroll at different speeds to make a beautiful effect – this process is called the parallax effect and we wanted to go into some details about it.

8:02

HAWRAF site scrolling

Our friends at creative agency HAWRAF launched their new site recently. We wanted to show how the side scrolling effect they're using works.

6:54

Logo sprite animation

A few people have asked how do we make the logo move on our site. It's not a special Javascript thing but instead using CSS and one long image strip.

9:42

Get Coleman

This week, freelance copywriter Joe Coleman launched his new site called Get Coleman. We talk about how it was made and how to make your own

7:04

Untitled Sans

New Zealand font foundry Klim Type Foundry released a site for their new fonts, Untitled Sans and Untitled Serif. We show you how to make the launch site.

7:04

Barron Webster but with text

On the last video, we spoke about how to make the Barron Webster site, this time we show you how to make it not with images, but with text.

9:56

Barron Webster

Today, we talk about how to use "mousemove" in Javascript to make the effect as seen on Barron Webster's site

12:47