Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 411
  • Last Modified:

Rollover (MouseOver) graphics in a 'Form'

Does anybody know how to get rollover graphipcs to work inside of a form?

I can assign a graphic as a button without a problem, and then assign the appropriate command to that button; 'submit' etc, but I make them into rollover (image swap).

I've tried the default rollover graphic code from Dreamweaver as well as some custom Javscript but no dice..

Is it even possible?

0
silha
Asked:
silha
  • 3
  • 2
  • 2
  • +3
1 Solution
 
darksinclairCommented:
which programming language are you working in silha?  PHP? ASP?  do you really want to try and do it with javascript??
0
 
COBOLdinosaurCommented:
You have to use a regular image with events:

<img src="mouseout.gif" onmouseover="this.src='mouseover.gif'"
   onmouseout="this.src='mouseout.gif'" onclick="document.forms[0].submit()">

Cd&
0
 
SkonenCommented:
darksinclair said:
"which programming language are you working in silha?  PHP? ASP?  do you really want to try and do it with javascript??"

Darksinclair: Such a task can only be accomplished in client side scripting such as Javascript or Flash. PHP and ASP are server-side, so once the page has been sent, the server does not have any influence tp what the user chooses to do on his/her system.
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
silhaAuthor Commented:
Correct... it MUST be client side... (that much I know) and which is why I was trying JavaScript in the first place.

I will attempt to use the code from COBOLdinosaur, but I'm not optinistic as I wrote some very similar code a few days ago that didn't work... COBOLdinosaur's code however is sufficiently different enough to try.

I'll post the results here either way..

Thanks to all, any further comments are appreciated.

Regards,

-Silha

PS.. the source files in question are PHP.. (for those who asked...)

0
 
ZylochCommented:
There's nothing wrong with Cd's script. If implemented correctly, it should definitely work. Just watch for those quote mixups, especially if you're echoing with PHP.
0
 
xakemCommented:
hello!
as i remember we can use images instead of submit buttons, try this:

<input type="image" src="img1.ext" onMouseOver="this.src='img2.ext'" onMouseOut="this.src='img1.ext'>
0
 
silhaAuthor Commented:
Maybe I'm just technically impaired on this one... I just can't get the code above to work... (and it looks as if it should!)

Below is a line from my current page (using a stand graphic as a button in a form) the 'rollover' graphic would be /image/Buttons/save-n-close_hvr.gif

<input name="btnContinue" type="image" id="btnContinue" value="Continue" src="/image/Buttons/save-n-close.gif" alt="Continue Button" width="148" height="37" border="0">

0
 
ZylochCommented:
Try

<input name="btnContinue" type="image" id="btnContinue" value="Continue src="/image/Buttons/save-n-close.gif" alt="Continue Button" title="Continue Button" width="148" height="37" border="0" onmouseover="this.src='/image/Buttons/save-n-close_hvr.gif';" onmouseout="this.src='/image/Buttons/save-n-close.gif';">
0
 
silhaAuthor Commented:

OH MY GOD! <it works!>

Required a little fine tuning but this appaears to be it!!!

<input name="btnContinue" type="image" id="btnContinue" title="Continue Button" onMouseOver="this.src='/image/Buttons/save-n-close_hvr.gif';" onMouseOut="this.src='/image/Buttons/save-n-close.gif';" value="Continue src='/image/Buttons/save-n-close.gif" src="../image/Buttons/save-n-close.gif" width="148" height="37" border="0">

Thanks to everybody for their input!

-E
0
 
xakemCommented:
not at all
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 2
  • 2
  • +3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now