Adding a gif to the submit button

In this article we will describe how to put a GIF image in a submit button. This can be particularly useful when using the upload feature, thus suggesting to the user that the file is being uploaded.

The first step is to create a hidden "div" within the form's layout, which contains the desired GIF file. Here is an example on how it would look like:

 
<div id="your_div_id" style="display: none">
<img src="/path/to/your.gif" alt="gif"/>
</div>
 

The second step is to create a normal button (instead of the usual "Submit" button) and typing the following code to the "Additional Attributes" area:

onclick="document.getElementById('your_div_id').style.display='';formname_id.submit();"
 
This is the end to this simple customization that brings a nice effect to your form.

One person found this article helpful.


Was this article helpful?

Yes No
Sorry about that

You Should Also Read

Nothing happens after clicking submit

My form won't submit in Internet Explorer 9!

My form won't get submitted