Rollover Submit Button


#1

Hello there,

It seems I always arrive at this point and can’t figure it out. I’m putting together an announcement list, and not only do I want to use my own submit and unsub buttons, but I want them to maintain their rollover nature. However, whenever I add any part or all of the K-Base’s suggested

I loose the rollover effect. Here’s the latest submit button that I’m working on (I use Dreamweaver):

Could you please take a look at the code, and let me know how to have my cake and eat it too?

Thanks much for your time.

White Ash
www.White-Ash.com


#2

I don’t see anything in that code that makes that button actually submit, or do anything else when clicked on; is that part to be added later?

Using is a bad idea; it causes the browser to jump to the top of the page (or maybe the bottom of the page in some browser versions?) and add an extra URL to the back-button stack. You can suppress this by including “return false” at the end of whatever JavaScript event handles clicking on the button, but even better would be to make the HREF attribute something meaningful that lets your site degrade gracefully for non-JavaScript users. (Unfortunately, there’s probably no way to gracefully duplicate a form submission with a plain HREF, so going to your code instead of a normal submit button is a bad idea for accessibility.)

You should also have more meaningful ALT text than an empty string.

– Dan


#3

[quote]I don’t see anything in that code that makes that button actually
submit, or do anything else when clicked on; is that part to be
added later?

[/quote]

In my experience, there’s usually nothing wrong with submitting a form with an “image input type” - I do it all the time. It shouldn’t even require Javascript.

Whether or not it works in this particular form, though, is another story. I don’t know.

  • Jeff @ DreamHost
  • DH Discussion Forum Admin

#4

but that’s a standard image tag /not/ an image form element in her example.

Does this work?


#5

You should include alt=“Subscribe” in that so that text-mode browsers see what the button does.

– Dan