Form Help

  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

Need a bit of help on a form. I am needing to use a rollover image as the submit button for a form. How would I go about doing this?

Currently the rollover image/button is using the rollover/preload code from Dreamweaver. I would like to continue to use this if possible. I need it to perform the following:
Code: [ Select ]
<input name="submit" type="submit">


Any help would be appreciated.
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

I have made some headway with this. I have one issue to solve, and haven't had any luck so far.

Currently, the button has the desired rollover effect, as well as submits the form properly.

The issue I am currently having is the label on the button. By adding the type as "type="submit"" it adds the label Submit on top of the button.



The code:
CSS:
Code: [ Select ]
.loginb {
background: url(images/login_u.png);
width: 106px;
height: 34px;
border: 0;
padding: 0;
}

a:hover input.loginb {
background: url(images/login_o.png);
background-position: 0 0;
width: 106px;
height: 34px;
border: 0;
padding: 0;
}


.rollover a, button
{
width: 106px;
height: 34px;
padding: 0;
border: 0;
cursor: pointer;
display: block;
}
  1. .loginb {
  2. background: url(images/login_u.png);
  3. width: 106px;
  4. height: 34px;
  5. border: 0;
  6. padding: 0;
  7. }
  8. a:hover input.loginb {
  9. background: url(images/login_o.png);
  10. background-position: 0 0;
  11. width: 106px;
  12. height: 34px;
  13. border: 0;
  14. padding: 0;
  15. }
  16. .rollover a, button
  17. {
  18. width: 106px;
  19. height: 34px;
  20. padding: 0;
  21. border: 0;
  22. cursor: pointer;
  23. display: block;
  24. }



HTML:
Code: [ Select ]
<a class="rollover" href="#"><input type="submit" name="submit" class="loginb" /></a>



So right now I just need a way to remove the label on the button. Any help would be appreciated.
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

All fixed and working. Cannot believe I didn't think of it earlier. All I had to do was add value="". I guess taking short breaks every once and a while can be beneficial.
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • User avatar
  • Posts: 23456
  • Loc: Woodbridge VA

Post 3+ Months Ago

Hey Poly. long time no see. Glad you got it solved yourself. Looks like it didn't take you long.
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

Hey ATNO, yeah helps when you decide to take a break for a few minutes and get some fresh air. How have you been?

Post Information

  • Total Posts in this topic: 5 posts
  • Users browsing this forum: No registered users and 33 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.