Cambiar color de div al pasar cursor

[MarioAlejandroCR2]

Como cambio el color de un div cuando paso el cursor sobre el, justo como he visto en varios sitios como youtube en los comentarios, de antemano gracias :)

[Gashe]

<div onmouseover="this.style.backgroundColor='#999'"></div>

Si quieres que cuando salga del <div> recupere el color que tenia solo tienes que añadir onmouseout="this.style.backgroundColor='color'".

Espero que te sirva de ayuda! :)

[MarioAlejandroCR2]

Si funciona en un div comun pero este funciona asi:

Código PHP:

echo '<div class="divnoti" onmouseover="this.style.backgroundColor="#999"">' ,substr($cadena,0,strpos($cadena,' ',350)) ,' ...<br><a href="./noticialog.php?idn='.$cateFila["idnoticia"].'">Ver más ...</a><hr color="#e1e1e1"></hr></div>
 

Si uso this.style.backgroundColor='#999'" me da problemas debo usarlo como ="#999" pero asi no funcionaria

[Gashe]

Si lo ejecutas directamente en el div:

<div onmouseover="this.style.backgroundColor='#999'" onmouseout="this.style.backgroundColor=''"></div>

Solo cambiaria este div. Si por el contrario lo ejecutas desde una funcion en javascript, solo tienes que añadirle una id al div, algo como esto:

<script>
function efecto(tipo)
{
if(tipo == 0)
document.getElementById('dv1').style.backgroundCol or='#999';
else
document.getElementById('dv1').style.backgroundCol or='';
}
</script>

<div id="dv1" onmouseover="efecto(0)" onmouseout="efecto(1)">TEXTO</div>

[cereal]

Solo un comentario, que me he dado cuenta porque no le funciona por si habias hecho un copy/paste:

Gashe ha hecho bien con onmouseover y onmouseout, pero en el segundo le falta cerrar una comilla simple.

Escribió:

onmouseout="this.style.backgroundColor='color"

Y lo correcto es:

onmouseout="this.style.backgroundColor='color'" <-- faltaba cerrar con una comilla simple.


Saludos.

[Gashe]

jejeje Cierto!! corregido cereal ;)

[Gashe]

Iniciado por MarioAlejandroCR2

Si funciona en un div comun pero este funciona asi:

Código PHP:

echo '<div class="divnoti" onmouseover="this.style.backgroundColor="#999"">' ,substr($cadena,0,strpos($cadena,' ',350)) ,' ...<br><a href="./noticialog.php?idn='.$cateFila["idnoticia"].'">Ver más ...</a><hr color="#e1e1e1"></hr></div>
 

Si uso this.style.backgroundColor='#999'" me da problemas debo usarlo como ="#999" pero asi no funcionaria

Al meterlo dentro de php, te haces un lio con las comillas, para no liarte puedes hacer esto cuando toque la sentencia de php:

?><div class="divnoti" onmouseover="this.style.backgroundColor='#999'"><? php echo substr($cadena,0,strpos($cadena,' ',350)) , ..... ?></div>

Y recuerda las comillas dentro del onmouseover, despues de las dobles, van las simples onmouseover="this.style.backgroundColor='#999'"

[cereal]

Según las normas del PHP, si dentro del echo, tienes que añadir una doble comillas, deberás poner antes el símbolo \ para interpretar que el doble comillas es el texto en lugar de cerrar el echo.

O sea,

Código:

echo "Hola, mi alias es "Cereal"";

Salida en la pantalla: Hola, mi alias es

No funciona bien porque se ha cerrado el echo antes de la palabra Cereal.

Con lo cual puedes hacer lo siguiente:

Código:

echo "Hola, mi alias es \"Cereal\" ";

Salida en la pantalla: Hola, mi alias es "Cereal"


Saludos.