Thursday, 12 December 2013

OUGD504: STUDIO BRIEF 2 - Design for Web // Coding The Slider

In my website, I wanted to have a sliding banner. I didn't quite expect this to be as difficult as I thought it turned out to be. However, I managed. I had to find some recourses online to make it work. 


I managed to find a jquery.js online, which most developers use to code with. The jquery is incredibly complex, something which I could never every be able to code on my own. As you can see above, it's about 20 full screens worth of java script. 


I then looked at some web tutorials and coded the slider.js Adjusting the number in red, controls the time per slide. 


The styles.css sheet is being used across all my pages, to avoid this, I created an addition .css to link only with my index.html  I created the properties for the slider in this .css 


I linked it to the page, using the same method as I would with any other css.js page, I also linked the jquery.js and slider.js pages to the index page. So they would all work together.


I created a list item, which would contain the images I would place in my slider. I experimented by using an overlay, which had an image title and some descriptive text, however, I didn't think this was necessary, so I turned the opacity to 0% in the slider.css

No comments:

Post a Comment