Imagen roll over para env�o de formularios

Por Miguel Cruz Art�culos publicados: 3 Valoraci�n media: 3.79/5 Usuario desde: 22/12/2002

El c�digo HTML nos permite sustituir el t�pico bot�n de formulario por una imagen con s�lo cambiar el valor del atributo type de la etiqueta input (type="submit" por type="image"), pero no es posible crear un roll over o imagen de sustituci�n a trav�s del c�digo html para el env�o de formularios, como tampoco lo es posible para la creaci�n del roll over convencional.

<SCRIPT language="Javascript">
function enviar() {
document.formulario.submit();
}
</SCRIPT> 

Pues bien, la soluci�n, es bien sencilla y compatible entre los navegadores IE y Netscape. Hay que a�adir dentro del HEAD la definici�n de la funci�n enviar(). Dicha funci�n es la que se encargar� de enviar el formulario llamado "formulario".

Ahora creamos roll over cl�sico en JavaScript e insertado dentro de la etiqueta FORM de la forma:

<form name="formulario" method="get">
   <a href= "javascript:enviar()" 
         onmouseOver="document.enviar.src='enviar2.gif';"    
         onmouseOut="document.enviar.src='enviar1.gif';">
   <img name="enviar" src="enviar1.gif"border="0">
</a>
</form>

Ejemplo:

Es importante recordar que el nombre del formulario HTML sea el mismo al que viene definido en la funci�n enviar() del HEAD. Como se ve en el c�digo, la llamada a la funci�n se hace a trav�s del v�nculo, por lo que a partir de cualquier roll over funcionar� correctamente.

Valoraci�n

Comentarios

A�adir un comentario

Si no est� de acuerdo con algo o quiere a�adir m�s informaci�n al respecto puede incluirla a�adiendo un comentario.

Colabora

�Te sientes capacitado para escribir un art�culo como este? �Te gustar�a colaborar escribiendo art�culos en WebEstilo? H�znoslo saber !!