Imagen de fondo en el boton

[JUAN CARLOS RB]

Como puedo ponerle una imagen de fondo para cuando pase el raton por encima del boton.

[Legoltaz]

Código JavaScript:

<input type="button" onMouseOver="this.style.background='url(\'url_imagen\')'" />
 

[JUAN CARLOS RB]

Lo he puesto y no va.

<input type="button" name="btnnuevainci" id="btnnuevainci" class="btnnuevainci" value="Nueva Incidencia" onClick="location.href='NuevaInciadmin.php'" onMouseOver="this.style.background='url(\'..\image nes\btn2.gif')" '/>

[Legoltaz]

Has copiado mal el código.

Código JavaScript:

onMouseOver="this.style.background='url(\'..\\image nes\\btn2.gif')'"/>
 

[JUAN CARLOS RB]

onMouseOver="this.style.background='url(\'..\Image nes\btn2.gif\')'"

Perdona esto es lo que he puesto.

[JUAN CARLOS RB]

lo que pongo es cuando el raton está fuera y cuando esta dentro del boton:

<input type="button" name="btnnuevainci" id="btnnuevainci" class="btnnuevainci" value="Nueva Incidencia" onClick="location.href='NuevaInciadmin.php'" onMouseOver="this.style.background='url(\'..\\Imag enes\\btn2.gif\')'" onMouseUp="this.style.background='url(\'..\\Imagen es\\btn.gif\')'"/>

[PoLiZe]

Tiene que quedar asi creo

Código javascript:

onMouseOver="this.style.background='url(\'Image nes\'btn2.gif\')'"
 

[gioramies]

Hola:

Quizás lo que JUAN CARLOS RB está preguntando puede realizarse sin mucho esfuerzo con CSS, de la siguiente forma:

Código:

HTML:
<input type="button" value="Boton" class="clase_boton" />

CSS:
.clase_boton:hover {
     background-image: url('url de mi imagen ');
}

Te recomiendo que lo hagas así, es más fácil, práctico, y no recargas el lado del cliente con programación Javascript. Además, puedes hacerlo con muchos botones que tengan el mismo valor en su atributo class, sin necesidad de colocarlo en cada input, es más eficiente.

Saludos.

[JUAN CARLOS RB]

Buenas. El problema que ese boton ya está llamando a otro css:

.btnnuevainci{ padding: 0;
margin: 0;
border: 1; /*no quiero borde*/
background-image:url(../Imagenes/btn.gif);
width: 120px;
height: 50pxcm;
cursor: pointer; /*muestrame el cursor de mano*/
font:Georgia, "Times New Roman", Times, serif;
/*text-indent: -999px; manda el texto leeeeejos*/
/*overflow: hidden; /*esconde cualquier trazo del mismo*/
color: #FFFFCC;
}

Se le puede añadir aquí lo que tú dices???

[gioramies]

Hola. Deja esa como está y luego de esa adicionale a a tu CSS esta para ver que sucede:

Código:

.btnnuevainci:hover {
    background-image: url('../Imagenes/btn2.gif');
}

Dime como te fue.

[JUAN CARLOS RB]

Que tengo que poner en class:()

Dentro del boton

[gioramies]

tienes que colocar class="btnnuevainci". Eso daría resultado

[CHuLoSoY]

A ver si nos aclaramos. Y una función para ver si está encima o fuera y cambie la clase ?¿ Imagínate:

Dos clases css (una con background-image y otra no):

<style>
.encima { background-image : url('fondo.png');
.fuera { background-image: none; }
</style>

Una función javascript:

<script>
function cambiar(boton,como) {

if(como=="encima") {

document.getElementById(boton).className="encima";

} else {

document.getElementById(boton).className="fuera";

}

}
</script>

El HTML que llama:

<input type=button id=botonDondeHacerCosas onmouseover="javascript:cambiar('botonDondeHacerCo sas','encima');" onmouseout="javascript:cambiar('botonDondeHacerCos as','fuera');">

Puedes jugar con ello y hacer cosas muy buenas.

Un salduo.