Design Techniques Deconstructed

What I have tried to do here is to change some of the code that I am using in my designs to add functions that illustrate what is going on.

In some cases, the Clearing Float example, I have purposely broken the page and added back a menu option to fix it. This and the Fixed Bottom Menu analysis page are examples of how JavaScript is used to manipulate the Document Object.

• Not Clearing Floats - shows what happens when a Clearfix is not made.
• Fixed Bottom Menu Analysis
• Top Responsive Menu - a responsive top nav with open/close button (VH Website)
• The W3 Framework - with another attempt at deconstructing

Links

• Analysis of New Layout - a re-write of my original rwd template
• Setting Home Page link Dynamically - developed for the VH website and now Contextual design
• Setting Headers etc by context - selecting and modifying elements onLoad
• getElementByClass - should have been getElementsByClassName - where I might want to use this selector
• Setting colours on context - A next step is setting classes on load
• A top menu page - With an open and close responsive - emulating the theme I am currently using on the VH website
• Horizontal and Vertical Button Group - Similar to my use of the Unordered List