By Naomi Girdler

Module Code: FDGP202

Saturday 18 February 2012

Horizontal Scrolling

To begin the process of creating my website, my first port of call was to create the basic structure behind my horizontal scrolling. In the past I have dabbled with creating a horizontal scrolling website and I was hoping that I'd be able to find the website I'd created, and re-create it for this project. However, it wasn't really appropriate to use in this project, so I set out to try and find a tutorial or piece of coding that could help me create this horizontal scrolling for myself.

I came across this simple tutorial which used CSS code and Jquery/Javascript to create a horizontal scrolling blog. Using the code and examples they featured in this tutorial, I began building my own horizontal scrolling website for Vivienne Westwood. There were many changes I had to make though to create the design I had in mind for this project.


As you can see from their demo website, it's very different in design and layout to what I wanted to have for my website layout, however was still a very good skeleton for me to work on.

Since the way in which the horizontal scrolling worked, there was little for me to change within the more complex coding of the Javascript/Jquery, so most of the changes I made was in the CSS code that helped build the design. I changed various colours, edited fonts, changed link styles as well as changing the width of the separate 'post' sections of the scrolling to allow for it to be more tailored to images and informational text.


No comments:

Post a Comment