I would highly advised reimplementing this and not trying to fudge the
javascript. The css version is much easier to maintain.
do a google search for css rollover buttons. There's a ton of tutorials out
there.
They all basically say:
-make your links block elements. once the links are block elements, you can
arranged them however you want. I usually drop them into a ul and use the
list as a nav bar. (looks like your site could just have 2 list of links and
you can place them on either side of the logo. (be sure to turn list styling
off - ul {list-style:none} - if you use ul's)
a.rollover{display:block;}
- make your links the same height and width as your image
a.rollover{
display:block;
height:25px;
width:100px;
}
- use your desired image as the background of the links
a.rollover{
display:block;
height:25px;
width:100px;
background: #ff url('dogbone.gif') no-repeat fixed center;
}
- then use the a:hover pseudo element to switch the background when you
mouse over the links
a.rollover:hover
{
background: #ff url('dogbonewithbite.gif') no-repeat fixed center;
}
I promise, after doing pure css rollovers, you'll never go back.
cheers,
-jk
On 8/31/05, Pat Pruyne [EMAIL PROTECTED] wrote:
Greetings,
I'm still medium-low on the CSS learning curve and have been
tasked to update a site created by someone else that has lots of
javascript button image replacement actions at the top of it.
My temptation is to just take the javascript and tuck them into
their own containers so that I can position them.
I am certain there is a better way to do this.
Here's the page:
http://www.valleyvethospital.com/index2.html
I would welcome pointers and clues as to how I should approach
this and learn something (a lot!) in the process.
Thanks,
Pat
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org http://evolt.org --
http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/