Cambiar color al texto haciendo click en imagen

[osek2112]

Hola!

Quisiera que me ayuden con un código.

Tengo una tabla donde en una columna tengo una imagen de un candado y en la otra una imagen de un lápiz. En la tercera columna tengo un texto. Quiero que cuando dé click en la primera imagen el texto se ponga de color amarillo y cuando de clic en la segunda imagen el texto se ponga en celeste.

¿Cómo podría hacer esto?

Agradeceré mucho su ayuda.

Saludos,

[_cronos2]

Pon en el evento onclick la función para que cambie el color de la letra y ya está.
Saludos (:

[osek2112]

Este es el código que tengo:

<td><span class="Estilo10">Cecilia Cabello </span></td>
<td><div align="center"> <a href="http://www.yahoo.com" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); return false;"><img src="images/lock.png" width="32" height="32" border="0"/>
</a></a></div></td>
<td><div align="center"><a href="http://www.google.com.pe/" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); return false;"><img src="images/unlock.png" width="32" height="32" border="0"/></a></div></td>


¿Dónde es que tengo que poner el evento onclick?

Agradezco la ayuda.

Saludos!

[danistrein]

Código Javascript:

function cambiarColor(a,b){
var a=document.getElementId(a);
a.style.color=b;
}
 

Código HTML:

<td><span class="Estilo10">Cecilia Cabello </span></td>
<td><div align="center"> <a href="http://www.yahoo.com" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#333333'); return false;"><img src="images/lock.png" width="32" height="32" border="0"/>
</a></a></div></td>
<td><div align="center"><a href="http://www.google.com.pe/" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#000000'); return false;"><img src="images/unlock.png" width="32" height="32" border="0"/></a></div></td>
 

bueno la funcion se llama "cambiarColor" el cual tiene 2 variables una es el id del div(tambien puede ser span o cualquier otra cosa) que contiene el texto, la segunda variable tiene el color ejemplo negro(#000000), gris(#333333), ahi te lo deje listo lo unico que te falta es poner en donde se encuentra el texto el DIV ejemplo:

Código HTML:

Texto Cambia Color
 

Lo cambias a :

Código HTML:

<div id="texto_de_color">Texto Cambia Color</div>
<--/ o tambien /-->
<span id="texto_de_color">Texto Cambia Color</span>
 

¿Dónde es que tengo que poner el evento onclick?

si ejemplo en tu codigo:

Código HTML:

window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#000000'); return false;
 

[osek2112]

Hola,

Gracias por tu respuesta. Estuve probando lo que me dijiste, pero nada, no me funciona.

Éste es el código:

<script language="javascript">
function cambiarColor(a,b){
var a=document.getElementId(a);
a.style.color=b;
}
</script>

<td><div id="texto_de_color">Cecilia Cabello</div></td>
<td><a href="http://www.yahoo.com" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#FF0000'); return false;"><img src="images/lock.png" width="32" height="32" border="0"/>
</a></a></td>
<td><a href="http://www.google.com.pe" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#0000FF'); return false;"><img src="images/unlock.png" width="32" height="32" border="0"/></a></td>


¿Tienes alguna idea de porqué?, ¿qué me ha faltado?

Gracias por la ayuda.

Saludos,

[danistrein]

hola eh descubierto el error, ya que lo hice sin probar no sabia si estaba bien pero el error esta cuando reconoce el div, mira:
reemplaza:

Código Javascript:

var a=document.getElementId(a);
 

por:

Código Javascript:

var a=document.getElementById(a);
 

me falto ponerle "By", ahora te funcionara bien tiene que quedar asi:

Código Javascript:

<script type="text/javascript">
function cambiarColor(a,b){
var a=document.getElementById(a);
a.style.color=b;
}
</script>
 

[EroChvc]

ESO es ya Dhtml

[osek2112]

Gracias danistrein!

Me funcionó!, pero tengo otra pregunta, si quiero usarlo para varios links, es decir, no sólo para el que te puse de ejemplo sino para 2 links más, con diferente nombre y href. He probado con ésto que me diste pero sólo me funciona para el primero. Si hago click en otro nombre me cambia el primero más no el nombre que quiero.
Te dejo el código a ver si me das otra manito.
Tendría que ponerle otro nombre de DIV?


Código Java Script:

<script language="javascript">
function cambiarColor(a,b){
var a=document.getElementById(a);
a.style.color=b;
}
</script>


Código HTML:

<td><div id="texto_de_color">Cecilia Cabello</div></td>
<td><a href="http://www.yahoo.com" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#FF0000'); return false;"><img src="images/lock.png" width="32" height="32" border="0"/>
</a></a></td>
<td><a href="http://www.google.com.pe" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#0000FF'); return false;"><img src="images/unlock.png" width="32" height="32" border="0"/></a></td>



<td><div id="texto_de_color">Paul Geldres</div></td>
<td><a href="http://www.msn.com" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#FF0000'); return false;"><img src="images/lock.png" width="32" height="32" border="0"/>
</a></a></td>
<td><a href="http://www.elcomercio.com.pe" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#0000FF'); return false;"><img src="images/unlock.png" width="32" height="32" border="0"/></a></td>


<td><div id="texto_de_color">Angela V.</div></td>
<td><a href="http://www.trome.com" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#FF0000'); return false;"><img src="images/lock.png" width="32" height="32" border="0"/>
</a></a></td>
<td><a href="http://www.facebook.com" onClick="window.open(this.href, this.target, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=400, height=150, top=85, left=140'); cambiarColor('texto_de_color','#0000FF'); return false;"><img src="images/unlock.png" width="32" height="32" border="0"/></a></td>

Desde ya agradezco la ayuda que me puedas brindar.

Gracias y saludos

[danistrein]

hola el codigo que te pase lo puedes usar para cuantos links quieras, todo depende de la funcion ejemplo:

Código Javascript:

cambiarColor('AKI VA EL ID DEL TAG QUE QUIERES CAMBIAR DE COLOR','#333333');
 

como te dije en el ejemplo anterior puedes utilizarlo en cualquier tag:

Código HTML:

<div id="texto_de_color">Texto Cambia Color</div>
<--/ o tambien /-->
<span id="texto_de_color">Texto Cambia Color</span>
 

cualquier duda que tengas te mande un mp con mi email asi me agregas, asi no estamos reactivando este tema,