Webspace now has a whole new meaning

Posted on December 31, 2013


The standard method of navigating a webpage has traditionally been to vertically scroll. On occasions a site may present some horizontal movement, but this is usually confined to the ‘viewing window’ within a vertical page and the elements come from the left or right into view.

It was, then, only a matter of time before someone using the fairly ubiquitous jQuery library would break that mould and present us with something different.

Although not the only example of this kind of navigation, the small jQuery plugin called ‘Full Content’ is a great place to start. Instead of scrolling vertically to the next area of content, the user is now able to define a content block’s position in the ‘map-space’. This means it can be offset a good distance in any direction from the content that is being viewed. When a user clicks one of the links, their browser will take them over to the new content – the effect is achieved by disabling horizontal scroll bars in the browser using a CSS method:

body { overflow-x: hidden; overflow-y: hidden; }

It even offers the developer the ability to include vertical scrolling in some sections via:

stage1 { overflow-y: auto; }

This means that the traditional and familiar aspect of vertical scrolling is maintained, but a new and interesting method of navigation is also introduced, giving the website a vast and spacious feel.

Combined with some parallax scrolling, this could create quite a spectacular effect, setting a website apart from its peers.

Steven is Engage Web’s go-to man for all things web-related, bringing his knowledge of current trends in web design and development to the team.
Latest posts by Steven (see all)
Call Now Button

Who Engage Web has helped:

Ice Lolly Minuteman Press BUNZLGS1 UK The Underfloor Heating Store West Cheshire Athletic Club Thomas Cook MWB Business ExchangeWeb Media 360 D2 Architects Beacon Financial Training Steely ProductsBurlydam Garden Centre Asentiv BodyHQ Clever Vine Endeavour Mortgages Pro Networks Comm-Tech Wickers World Ascot Mortgages Top Teks
TEL: 0345 621 4321