Soy un estudiante de bachiller hace poco curse una materia de paginas web en la cual no sali airoso ahora mi profesor del curso de regularizacion me pide que haga una pagina que quizas suba luego a internet googleando encontre un efecto que me gusto. [URL="http://www.ssae.com.mx/cia2/"]http://www.ssae.com.mx/cia2/[/URL] Se trata de la tabla que esta a un lado del video donde se resalta cada x segundos un elemento de la izquierda y se cambia al mismo tiempo el contenido de la derecha y el nombre que baja cambia. Se lo mostre al profesor para obtener su ayuda pero me dijo que no quiere que no lo use por no poder hacerlo asi que me dijo que piense como hacer una funcion para indicarle unos pocos parametros y poder usarlo con cualquier tabla me dio ejemplos de parametros como por ejemplo el id de la tabla para animar, la orientacion izq o der dependiendo de si quiero animar la primera o ultima columna el numero de segundos y me dijo que piense si todos son necesarios o no o si hay mas necesarios. Como sea tengo 3 semanas y la fecha de entrega se aproxima etoy desesperado por ayuda ya lo intente varias veces logro que se resalten la primera o ultima columna pero cuando quiero que se haga de a celda en celda cada x segundos me marca error. intente usar settimeout y setinterval pero me marca error. aqui pongo el poco codigo que tengo aun y agradeceria toda la ayuda posible
newsmainboard.js
Código:
/*
a = id de la tabla a animar
b = orientacion izquierda o derecha
c = inicia en la celda
d = termina en la celda
e = intervalo de tiempo
*/
function resaltar(a,b) {
var color = ["#999999","#333333"];
tabla = document.getElementById(a);
filas = tabla.getElementsByTagName("tr") ;
if(filas[0].getElementsByTagName("th").length > 0) {
columnas = filas[0].getElementsByTagName("th");
}else if(filas[0].getElementsByTagName("td").length > 0) {
columnas = filas[0].getElementsByTagName("td")
}
var rpt = filas.length;
for(x=1; x <= rpt; x = x+1)
{
nt = x-1;
if(b=='izq') {
tl = filas[nt].getElementsByTagName("td");
setTimeout(tl[0].style.backgroundColor=color[0],10000);
setTimeout(tl[0].style.backgroundColor=color[1],10000);
}else if(b=='der') {
tl = filas[nt].getElementsByTagName("td");
tl[(tl.length)-1].style.backgroundColor=color[0];
}
}
setTimeout(tl[0].style.backgroundColor=color[0],10000);
}
index.html
Código:
<!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>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Animacion</title>
<script type="text/javascript" language="javascript" src="animar.js"></script>
</head>
<body onload="resaltar('noticias','izq'); ">
<div>
<table style="width: 100%;border:thin black solid" id="noticias">
<tr>
<td>
<img src="t26-06-09-b.jpg" width="60" height="39" alt="" />
a</td>
<td> </td>
</tr>
<tr>
<td>
<img src="t26-06-09-b.jpg" width="60" height="39" alt="" />b</td>
<td> </td>
</tr>
<tr>
<td>
<img src="t26-06-09-b.jpg" width="60" height="39" alt="" />c</td>
<td> </td>
</tr>
<tr>
<td>
<img src="t26-06-09-b.jpg" width="60" height="39" alt="" />d</td>
<td> </td>
</tr>
<tr>
<td>
<img src="t26-06-09-b.jpg" width="60" height="39" alt="" />e</td>
<td> </td>
</tr>
</table>
</div>
</body>
</html>