Some images in this post have been automatically down-sized, click on them to view the full sized versions:
Some images in this post have been automatically down-sized, click on them to view the full sized versions:
Some images in this post have been automatically down-sized, click on them to view the full sized versions:
I've decided that I wanted to design and create my own website. I was sick of all the templated websites that everyone has. I decided to create my own. My problem is this. I have this image that I am using for the background of the website. I designed it in PSP 8 (although not much of a design).
Please don't comment on the design, layout, or anything else you might be thinking. I just would like answers to my problem please. 
My problem is this. I want the links on my not so uniformed nav bar, to go fuzzy when I put my cursor on them. I have already achieved the exact effect I wanted with a java script. Here is an example of what I am talking about.
Heres before :
Heres after :
In my HTML editor that I use, ( 1st Page 2000 ) I used a java script to achieve exactly what I wanted. But It was only with the smaller images, not the big picture. So I guess my question is how do I implement this effect into the bigger picture?
BTW, heres the code for the script. I doubt it will work if you load it up in an editor because you don't have the images. :
<!-- Rollover Image Script - Place within <head> tag -->
<!-- Hide from older browsers
function SwitchImg()
{ //start
var rem, keep=0, store, obj, switcher=new Array, history=document.Data;
for (rem=0; rem < (SwitchImg.arguments.length-2); rem+=3) {
store = SwitchImg.arguments[(navigator.appName == 'Netscape')?rem:rem+1];
if ((store.indexOf('document.layers[')==0 && document.layers==null) ||
(store.indexOf('document.all[')==0 && document.all==null))
store = 'document'+store.substring(store.lastIndexOf('.'),store.length);
obj = eval(store);
if (obj != null) {
switcher[keep++] = obj;
switcher[keep++] = (history==null || history[keep-1]!=obj)?obj.src:history[keep];
obj.src = SwitchImg.arguments[rem+2];
} }
document.Data = switcher;
} //end
function RestoreImg()
{ //start
if (document.Data != null)
for (var rem=0; rem<(document.Data.length-1); rem+=2)
document.Data[rem].src=document.Data[rem+1];
} //end
// end hiding contents -->
</script>
<a href="links.html" onMouseOut="RestoreImg()" onMouseOver="SwitchImg('document.linksthree','document.linksthree','linkstwo.jpg')"><img src="linksone.jpg" name="linksthree" width="98" height="34" alt="Links" border="0"></a>
Thank you for reading my post.
