5/11: 7 new comment boxes, 8 new icons, new plugboard @ rewindd.com/ plugboard.
5/07: New site layout!
5/04: 10 new music layouts.
4/27: 12 new layouts, 2 new dark layouts.
4/26: 4 new icons.
4/17: 24 new icons.
4/06: 4 new retro layouts, 3 new comment boxes.
3/30: 6 new contact button sets.
3/23: 3 new layouts, 6 new comment boxes.
3/16: Complete revamp of Rewindd.com/Music.
3/12: New site layout!
3/09: 6 new layouts, 4 new image technique tutorials.
3/02: 8 new layouts, 4 new divs, 2 new dark layouts, 8 new comment boxes.
Image Rollovers
Here's how to do a simple image link rollover. Ex:
Alright, first we're gonna need the images you're going to use. Image1 will be the actual image link,
and Image2 will be image you see when you hover over Image1. Here are the images I will use:
Image1:
Image2:
Remember that you'll need to know the exact height and width of these images. You'll have to put them
into the style tags along with the image urls. Now let's to make the style tags. This will be all the coding
neccessary for the image hover:
Paste into About Me:
<style type="text/css">
.go {display:block;width:NUMBERpx;height:NUMBERpx;
background-color:transparent;
background-image:url("IMAGE1 URL");
background-repeat:no-repeat; background-position:top left; }
.go:hover {display:block;width:NUMBERpx;height:NUMBERpx;
background-color:transparent;
background-image:url("IMAGE2 URL");
background-repeat:no-repeat; background-position:bottom left;}
</style>
The "go" part can be changed to any name, just make sure that they match each other. For instance, you can change it
to "link" but you must also change "go:hover" to "link:hover." The bolded text will tell you what you need to
put there. Be sure to input put the correct information or the image hover will not work.
Finally, let's make the image hover link:
<a href="URL HERE" class="go"></a>
Again, remember that the "go" part of the link must match up with the coding. Simply place this link
where you want the image hover to show up and done!
