Website
Here I will explain some parts of my site and how I achieved the look I wanted.Header: The header is styled the same on all pages. It consists of a logo on the left, dummy facebook and twitter link, and my navigation. The navigation is a an Unordered List, with the list elements floated left. There is a border top and bottom when hovered over, and also the same border when the page is active.
Footer: The footer is also the same on all pages. There is a link to my blog on the left, which when hovered over changes image, this is also an external link to this blog. The image change as done using javascript.
Code :
<a href="http://zebone29.blogspot.ie/" onmouseover="document.joelogo.src=joe2.src" onmouseout="document.joelogo.src=joe.src" target="_blank">
<img src="file://localhost/Users/newuser/Desktop/website/images/joe.png" name="joelogo" alt="blog link">
</a>
Then there is a javascript file..javascript/script.js..which is the code for the image swap.
There is also a to top scroll button on the right.
Code:
<!--to top button-->
$('a[href=#toTop]').click(function(){
$('html, body').animate({scrollTop:0}, 'slow');
return false;
});
});
The content of each page is different, not by much, there is some adjustments to height so each page has its own content styling.
Some other features are the table which is highlighted when hovered over.
A google map is on the contact page, this was easy to insert and is handy for future use.
The stats page is made of mostly of 2 images, representing a petrol station fuel price bilboard.
No comments:
Post a Comment