change input image on hover

rubyonrails-talk
1

Hi guys,

I'm having troubles getting to change an image on hover using the image_submit_tag helper.

First of all I don't know if I should use css for this (as i would for a normal link) or rjs (which i don't know how to use it in this case).

Can anyone help me?

Thanks in advance,

Ben

2

benvandesande@gmail.com wrote:

Hi guys,

I'm having troubles getting to change an image on hover using the image_submit_tag helper.

First of all I don't know if I should use css for this (as i would for a normal link) or rjs (which i don't know how to use it in this case).

Can anyone help me?

Thanks in advance,

Ben

Hi Ben,

I too would love to know if this is possible. The closest thing I've come up with is a bit cheap and nasty and isn't anywhere near a solution. Basically I omit the source arguement in the image_submit_tag and let the submit class and submit:hover pseudoclass handle the image url i.e.

<%= image_submit_tag "", :class => 'submit'%>

.submit {background-image: url('/images/imageA.png')}

.submit:hover {background-image: url('/images/imageB.png')}

This kinda works but with nasty side effects in some browsers (good in Opera, bad in IE7, Firefox and Safari) and rightly so as I've technically supplied the browser with an emtpy submit button image.

When supplying image_submit_tag with the appropriate arguements (i.e. image source and class etc.) everything work fine but the hover pseudoclass is ignored and doesn't work.

If anyone else could shed some light I would be eternally greatful. Sure the image_submit_tag should be able to do more than just be an uninteresting button.

Cheers,

Mic

3

If you didn't use image_submit_tag, you could create an image link (< %= link_to(image_tag ...) %>), give it a class, style it in css, and specify an onClick form submission action. This might do what you want.

...But yes, it would be nice to do this with image_submit_tag...

-Kyle

4

Kyle wrote:

If you didn't use image_submit_tag, you could create an image link (< %= link_to(image_tag ...) %>), give it a class, style it in css, and specify an onClick form submission action. This might do what you want.

...But yes, it would be nice to do this with image_submit_tag...

-Kyle

On Apr 28, 12:40 am, Mic Cartwright <rails-mailing-l...@andreas-s.net>

Hi Kyle,

Thanks for the suggestion, I appreciate your help. I gave it a go but it still didn't give me the overall result that I was hoping for - very close though. It all worked well up until I tried applying some style with css. Without the css it essentially works just like the image_submit_tag.

Is it possible to modify the source code in image_submit_tag (available in the rails api) to create a new helper that I could use in it's place?

Cheers,

Mic