Help with rollover buttons

[Logan Knight]

Okay, I need help with a website that I'm currently making changes to. I'm 17 and my mom is a photographer/PhotoShop graphic designer. She has a friend that she needed help with her website and didn't want to pay a web designer to change something on her site.

I have my DreamWeaver logged into her web server and I am able to edit her site. She wants to add a "Parental Testimonials" tab/link to her site but I can't figure out how to add or even create the rollover tab that is being used. I know how to make a "standard" rollover button by using two separate images, but the the current button (I'll use the home tab for ex.) uses one image but within the image (.jpg) are two tabs that say Home, one white the other yellow. I just need to know how to make the image to go from one to the other. You can see what I'm talking about at newvillageacad.com if you need to. The home .jpg that I uploaded is being used on the site currently.

Any help would be great,
L. Knight

[TheGAME1264]

Wow...you're 17 and helping your mom? Dude, that's impressive.

What you're looking for is called CSS sprites. They basically define your "off" and your "over" states in one image, and use CSS background positioning to make the transition.

http://css-tricks.com/css-sprites/

[Webzarus]

I appreciated your enthusiasm and understand their desire not to pay a web designer for a ch age to the site.... I really do understand that aspect, but sometimes even well meaning gestures don't turn out the way we hope.

My concern is that you are editing a "live" site while learning some intermediate coding.

Even as a long time designer / developer... I never "edit" a live site, especially if I didn't write the original code.

I suggest and encourage you to pull a copy of the code, work on it, learn, on somewhere other than the live site. With WAMP, LAMP available as a testing server, there's really no reason to be working or learning how to do something on a live site .... Unless of course its a personal site , definately not someone's site that their business depends on.

[TheGAME1264]

Theoretically, he could test it by uploading the site to a subfolder for "dev" purposes, blocking the subfolder using a password, and doing it that way. That way, he doesn't mess up the live site and he doesn't have to set up a server either.

[Webzarus]

Theoretically, he could test it by uploading the site to a subfolder for "dev" purposes, blocking the subfolder using a password, and doing it that way. That way, he doesn't mess up the live site and he doesn't have to set up a server either.

Theoretically that's true... I just know I've had several clients in the past that tried something like that, forgot to block it... Search engines and customers end up on the "dev" site...

Or worse yet, they create an infinite loop in their code somewhere and bring down the site... Or choke the DB...

I always encourage "off site" development... If they don't want to do that, then I encourage a "cName" scenario with a seperate memory instance... And a seperate FTP instance... To create a least a minimal barrier between the test site and live site.