Mouseover effects on buttons?

[dpmagyari]

I am using the Helios theme and it is just the best looking thing since my Daughter was born. I am wondering if it would be difficult to add effects to the buttons on Helios. I would like to maybe change it to so the white letters in helios appear to light up when the mouse is over it. Can anyone point me in the right direction as to what I would need to do in order to do this? Would it be as simple as creating an identical button with a different colored font and naming it button2.giff and maybe code the effect according to the mouse position? <-----That was an attempt to sound like I know what I would be doing but I wouldnt really have a clue as to how to accomplish it. Any help or information will be appreciated.

[Bjørn]

Yes, thats exactly how you could it it. Not sure what you by position, but if you mean moving it slightly up or down, yes that is possible.

You need to adjust the code in each of the buttons of course, but it can be done easily. Do you mean all the buttons, or just the main ones? The main ones  is located in one file, but the rest is in several, so that would require some more editing...

[dpmagyari]

I am talking only about the main buttons on top of the theme. I am looking around and trying to figure it out slowly. I'm thinking once I figure out how to do the mouseover effects and make the buttons I will need to add the code to the index.template.php and upload the modified .gifs to the helios/english/images directory.

[Ciinien]

Yes, dp, you could do mouseover effects and accomplish that purpose. Any good graphics program will do that (i.e. Photoshop, PaintShopPro, Gimp, and many others--the good thing about Gimp is it's FREE... )

Simply create an additional button just like the original except with the glow effect you want and then use Javascript to swap them out on mouseover. You can find the Javascripts already coded on many sites (just Google for Javascript as I can't remember any off hand--this site used to have some). As an example, I did something similar on an old phpBB site I had (removed the link because I changed ISPs and now use Mambo/SMF on my live site and TinyPortal/SMF on my test site.

Good luck with getting it sorted though.

Cheers!
Ci

[Bjørn]

Also - have a look at the TechHead theme , that one use a simple mouse-over effect with just inline javascript on the main buttons. It won't do any pre-loading of extra buttons though. But once over the buttons, you have the image in your browsers cache.

Another idea I have used is in the Oxygen theme, that one use a background image which is moved on mouseover, revealing another image. Giving the effect of instant mouse-over. A bit trickier to set up , you need to try it out for the right move values, make a image with both images in it etc.

Personally I like that last one..but both - and more as Ciinien suggests -, will do.