Boton enviar con imagen

satjaen · #1 (**permalink**) 12/09/2012, 14:40

Boton enviar con imagen

--------------------------------------------------------------------------------

Perdonad pero asi no me funciona, necesito que me haga la funcion del id=btnfiltrar:

<input name="" type="image" id="btnfiltrar" src="imagenes_menu/boton_buscar.png" />

satjaen · #2 (**permalink**) 12/09/2012, 15:08

He probado con este y si funciona pero el botón es mas grande que la imagen.Como le pongo la clase?
Gracias

satjaen · #3 (**permalink**) 12/09/2012, 15:09

Perdón el cod:

<button type="button" id="btnfiltrar"><img src="imagenes_menu/boton_buscar.png"/></button>

#4 (**permalink**) 12/09/2012, 15:38

Cita:

Iniciado por satjaen

Perdón el cod:

<button type="button" id="btnfiltrar"><img src="imagenes_menu/boton_buscar.png"/></button>

Trata de reforzarlo con

Código HTML:

Ver originalstyle="border:0; margin:0; padding:0;"

Te quedaría algo así como

Código HTML:

Ver original<button type="button"  id="btnfiltrar" style="border:0; margin:0; padding:0;">
  <img src="imagenes_menu/boton_buscar.png"/>
</button>

Puede haber otras soluciones.

satjaen · #5 (**permalink**) 16/09/2012, 14:35

Y una pregunta, puedo hacer que salga la tipica manita cuando me ponga encima con el raton?
Gracias.

sebastopols · #6 (**permalink**) 16/09/2012, 14:55

Cita:

Iniciado por satjaen

Y una pregunta, puedo hacer que salga la tipica manita cuando me ponga encima con el raton?
Gracias.

Código HTML:

Ver original<... style="cursor: pointer">

saludos

.

satjaen · #7 (**permalink**) 17/09/2012, 01:09

Y que resalte con algún color?

vdaniel07 · #8 (**permalink**) 17/09/2012, 05:17

<input id="enviar" type="submit" value="" />

<style>

#enviar{background: url(TU IMAGEN DE FONDO) no-repeat; cursor: pointer; height: --px; width: --px;}
#enviar:hover{background: url(TU IMAGEN DE FONDO AL PASAR POR ENCIMA) no-repeat}

</style>

Espero que te sirva

satjaen · #9 (**permalink**) 17/09/2012, 05:41

Gracias VDANIEL07, lo que pasa es que esto no funciona con el id=btnfiltrar por que este id llama a un js y ademas solo quiero que cambie de color al pasar con la manita.
Muchas gracias.

caricatos · #10 (**permalink**) 17/09/2012, 05:44

Hola:

Me estoy perdiendo... los input type="image" hacen submit... o sea envía el formulario (aunque añade las coordenadas donde se pincha)...

Lo que no comprendo es:

Código:

necesito que me haga la funcion del id=btnfiltrar

Si necesitas validar debes usar el evento submit (cosa de javascript)

Saludos

vdaniel07 · #11 (**permalink**) 17/09/2012, 12:08

Si quieres que vea realmente tu problema, COLOCA TODO TU CÓDIGO así puedo comprenderlo y ayudarte xaxo ;)

satjaen · #12 (**permalink**) 17/09/2012, 16:16

index.php

Código PHP:

   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script type="text/javascript" src="assets/js/jquery-1.7.2.min.js"></script> 
<script type="text/javascript" src="assets/jqueryui/js/jquery-ui-1.8.16.custom.min.js"></script> 
<script type="text/javascript" src="assets/js/js.js"></script> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Documento sin título</title> 
<link href="estilo1.css" rel="stylesheet" type="text/css" /> 
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script> 
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" /> 
  <script>  
function enviar_formulario(){  
   document.form1.submit()  
}  
</script>  
 <script>  
function enviar_formulario1(){  
  document.form1.reset(); 
}  
</script>  
<script>  
function enviar() 
{     
var formulario = document.getElementById("");         
var dato = formulario[0];      
if (dato.value=="enviar"){         
alert("Enviando el formulario");         
formulario.submit();         
return true;     
} else {         
alert("No se envía el formulario");         
return false;    }} 
</script>  
</head> 
<body> 
<div id="contenedor"> 
<div id="cabecera">Consulta de intervenciones</div> 
<div id="tabla"> 
    <div id="formulario"> 
    <form id="frm_filtro" method="post" action="menu1.php" name="form1"> 
            <table width="685"> 
  <tr> 
    <td width="9%" class="campo_apellidos2">Teléfonos</td> 
    <td width="9%"><input name="telefono" type="text" size="9" /></td> 
    <td width="9%"><input name="telefono2" type="text" id="telefono2" size="9" /></td> 
    <td width="9%"><input name="telefono3" type="text" id="telefono3" size="9" /></td> 
    <td width="32%">&nbsp;</td> 
    <td width="18%" class="campo_apellidos2">NIF</td> 
    <td width="14%"><input name="NIF" type="text" id="NIF" size="9" /></td> 
  </tr> 
  <tr> 
    <td class="campo_apellidos2">Nombre</td> 
    <td colspan="4"><input name="nombre_apellidos" type="text" size="30" /> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
  </tr> 
  <tr> 
    <td class="campo_apellidos2">Localidad</td> 
    <td colspan="4"><input name="poblacion" type="text" size="30" /> 
      <span class="campo_apellidos2">C.Postal</span>      <input name="cod_postal" type="text" id="cod_postal" size="5" /></td> 
    <td class="campo_apellidos2">Provincia</td> 
    <td><input name="provincia" type="text" size="9" /></td> 
  </tr> 
  <tr> 
    <td class="campo_apellidos2">Calle</td> 
    <td colspan="4"><input name="calle" type="text" id="calle" size="45" /> 
      <span class="campo_apellidos2">Nº</span>      <input name="numero" type="text" id="numero" size="5" /></td> 
    <td class="campo_apellidos2">Edificio</td> 
    <td><input name="edificio" type="text" id="edificio" size="5" /></td> 
  </tr> 
  <tr> 
    <td class="campo_apellidos2">Puerta</td> 
    <td colspan="3"><input name="puerta" type="text" id="puerta" size="5" /> 
      <span class="campo_apellidos2">      Piso</span> 
      <input name="piso" type="text" id="piso" size="5" /> 
      <span class="campo_apellidos2">Letra</span>        <input name="letra" type="text" id="letra" size="5" /></td> 
    <td>&nbsp;</td> 
    <td><span class="campo_apellidos2">Nº Mante.</span></td> 
    <td><input name="mantenimiento" type="text" id="mantenimiento" size="5" /></td> 
  </tr> 
  </table> 
  <table width="100%"> 
  <tr> 
    <th scope="col"><button type="button"  id="btnfiltrar" name="btnfiltrar" style="border:0; margin:0; padding:0;cursor:pointer"> 
  <img src="imagenes_menu/boton_buscar.png"/> 
</button> 
</th> 
  </tr> 
</table>                 
          </form>          
   
    </div> 
    <div id="paneles"> 
      <div id="TabbedPanels1" class="TabbedPanels"> 
        <ul class="TabbedPanelsTabGroup"> 
          <li class="TabbedPanelsTab" tabindex="0">Usuarios</li> 
          <li class="TabbedPanelsTab" tabindex="0">Aparatos</li> 
          <li class="TabbedPanelsTab" tabindex="0">Intervenciones</li> 
</ul> 
        <div class="TabbedPanelsContentGroup"> 
          <div class="TabbedPanelsContent"> 
           <div id="usuario"> 
            <table width="100%" id="data" class="table-dg-grid" > 
             <thead> 
              <tr> 
       <tr bgcolor=#DFEBFF id=t70 onclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'> 
                    <th><span title="nu_usuario">Nº Usuario</span></th> 
                    <th><span title="telefono">Teléfono</span></th> 
                    <th><span title="nombre">Nombre</span></th> 
                    <th><span title="poblacion">Población</span></th>   
                     </tr> 
                </thead> 
                <tbody> 
                </tbody> 
            </table> 
                </div> 
          </div> 
          <div class="TabbedPanelsContent"><table width="100%" id="data1"> 
           <thead> 
  <tr> 
                    <th><span title="aparato"></span></th> 
                    <th><span title="marca"></span></th> 
                    <th><span title="modelo"></span></th> 
                    <th><span title="NUM_SERIE"></span></th> 
                    <th><span title="num_PRODUCTO"></span></th> 
                    <th><span title="FECHA_compra"></span></th> 
   </tr> 
                </thead> 
                <tbody> 
                </tbody> 
</table> 
</div> 
          <div class="TabbedPanelsContent"> 
            
          <table cellpadding="0" cellspacing="0" id="data2"> 
                <thead> 
                  <tr> 
                    <th><span title="num_aviso"></span></th> 
                    <th><span title="num_usuario"></span></th> 
                    <th><span title="aparato"></span></th> 
                    <th><span title="calle"></span></th> 
                    <th><span title="fecha_recepcion"></span></th> 
                    <th><span title="fecha_recepcion"></span></th> 
                    <th><span title="sintoma"></span></th> 
                  </tr> 
                </thead> 
                <tbody> 
                </tbody> 
              </table>             
          </div> 
</div> 
      </div> 
      <table width="100%"> 
        <tr> 
<th scope="col"><a class="" href="javascript:enviar_formulario()"><span></span><img src="imagenes_menu/generar_aviso1.png" width="150" height="40" border="0"/></a> 
</th> 
          <th scope="col">&nbsp;</th> 
          <th scope="col"></th> 
          <th scope="col"><a class="" href="javascript:enviar_formulario1()"><span></span><img src="imagenes_menu/boton_salir.png" width="150" height="40" border="0"/></a> 
 </th> 
        </tr> 
      </table> 
    </div> 
</div> 
</div> 
<script type="text/javascript"> 
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1"); 
</script> 
</body> 
</html>

Gracias.