Solved

Dynamic submit-button?

Posted on 1997-04-07
4
265 Views
Last Modified: 2012-05-04
I want to create dynamic buttons, i.e. buttons that look
like being pressed when the mouse moves over them and return
to normal (unpressed) state when the mouse moves out.
I use onMouseOver and onMouseOut.
The code looks like this:
<html>
  <head>
  <title>Dynamic Buttons - Test</title>
  <script language="JavaScript">
  <!--
  ima1 = new Image();
  ima1.src = "button.gif";   /* normal button */
  hima1 = new Image();
  hima1.src = "button_b.gif";  /* pressed button */

  function ImageOver(Index,NewIma)
  {
   window.document.images[Index].src = NewIma.src;
  }

   //-->
   </script>
   </head>
  <body>
...
  <a href="anywhere.htm" onMouseOver="ImageOver(1,hima1)" onMouseOut="ImageOver(1,ima1)">
  <img src="button.gif" border="0"></a>
...

This works fine if the buttons are just links to other
HTML-pages.
But I want to create a dynamic submit-button.
I tried something like this:

<form>
...
<input type="image" src="button.gif"
    onMouseOver="ImageOver(1,hima1)" onMouseOut="ImageOver(1,ima1)">
</form> ...

But it doesn't work.
Does anybody know what I can do to get dynamic submit
buttons?
0
Comment
Question by:steffi
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
4 Comments
 
LVL 1

Accepted Solution

by:
moorep earned 80 total points
ID: 1265178
You are right. You cannot make them dynamic in a form.
You would create the images as normal <A HREF...>
with the submit button doing this:
<A HREF="javascript:form_submit()" onMouseover.... onMouseout...>
This will work. Same for the reset button too.
function form_submit()      {
      document.MyForm.submit();
// end of function
}

function form_clear() {
          // This will only work for NN 3.x and above
            document.MyForm.reset();
      }
Now i also noticed a bug in NN3.x in that if you do a "go back" to the form, the name of the form, in this case MyForm, will be lost. You should replace it with document.forms[0].submit();
where forms[0] represents the first form declared on the page.
0
 
LVL 1

Expert Comment

by:moorep
ID: 1265180
I know a way to create a dynamic submit button so it is possible, but unfortunately I can't answer your question while you are evaluating another.
0
 
LVL 1

Expert Comment

by:jjung
ID: 1265181
there are no mouseover mouseout events on form inputs, buttons or otherwise. This is the question she has asked and i have answered it correctly.
I can create dynamic buttons til the cows come home too.
0
 
LVL 1

Expert Comment

by:moorep
ID: 1265182
Note that submit() will not work with forms that have:
ACTION=mailto:johndoe@domain.com
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!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Avoid defining the variables in the global scope; trying to define them in a local function scope. Because:   • Look-up is performed every time a variable is accessed.   • Variables are resolved backwards from most specific to least specific scope…
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question