Gordonmac Dot Com

Mostly a web development blog

CSS navigation with animated underline effect

Posted: March 16th, 2016 | Posted in: CSS, Tutorials

Just part of something I’ve been working on. The requirement was for a simple navigation, but it also had to have something different. I’m really starting to love CSS transforms! See the Pen Navigation with Animated Underline by Gordon Mackay (@gordonmacdotcom) on CodePen. The HTML <nav class=”nav–top”> <ul> …
Read more…


How to toggle responsive CSS navigation

Posted: February 25th, 2016 | Tags: | Posted in: CSS, jQuery, Tutorials

There are probably hundreds of ways to implement visibility toggling for navigation in responsive states, but this is the way I do it, it’s simple and sane. See the Pen Basic Responsive Navigation Toggle by Gordon Mackay (@gordonmacdotcom) on CodePen. The HTML Nothing exciting about the HTML markup …
Read more…


Creating a “hero panel” with video background

Posted: February 2nd, 2016 | Posted in: CSS, jQuery, Tutorials

Responsive video backgrounds (as featured on the homepage of the current version of this site) are pretty popular at the moment. They’re pretty cool if you want something a bit different from a static hero panel. Here’s how I did mine. See the Pen A “hero panel” with video …
Read more…


Murdo at six months

Posted: January 20th, 2016 | Tags: | Posted in: Family

I can’t believe our baby boy is six months old, time has flown! As you can see from these photos, baby-led weaning is proving to be a lot of fun! Posts like this don’t need any words — it’s just Murdo being Murdo :)