inicio Chat Foro
Busca
Musica Registrate Comentarios Contactame

Wedmasterayuda.es.tl cambia su desing a uno muchisimo mejor para su agrado
Este cambio de se deve a la nueva version que se esta creando se trata de la version 2.5 de wedmasterayudaMuchas mas opciones segiran surgiendo

Veer Mas

Wedmasterayuda busca entrar al mundo de la musica
Se agregara esta nueva seccion para mayor divercion

Veer Mas

Info No disponible
Juan Camilo Muñoz

iBienvenido a wedmasterayuda!

Iluminar filas

iluminar filas
Con este código podemos hacer que se cambie el color de fondo de las filas o columnas de una tabla, cuando pasa el ratón por encima. He añadido dos checkbox para elegir si queremos que se ilumines las filas, las columnas, las dos o ninguna.

Habría que poner a cada etiqueta <td> la llamada a la función iluminar() pero es bastante tedioso, así que he añadido la función ini() para que haga el trabajo sucio.

http://www.fileden.com/files/2008/5/22/1925126/botoncodigowedmasterayuda.JPG http://www.fileden.com/files/2008/5/22/1925126/botonwma324564.JPG

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Mostrar/ocultar filas y columnas</title>
<style type="text/css">
table {border-collapse:collapse;border:1px solid maroon;margin-left:80px}
td {border:1px solid maroon;width:30px;text-align:center}
</style>
<script type="text/javascript">
<!--
function ini() {
  tab=document.getElementById('tabla');
  for (i=0; ele=tab.getElementsByTagName('td')[i]; i++) {
    ele.onmouseover = function() {iluminar(this,true)}
    ele.onmouseout = function() {iluminar(this,false)}
  }
}

function iluminar(obj,valor) {
  fila = obj.parentNode;
  if (document.getElementById('filas').checked) {
    for (i=0; ele = fila.getElementsByTagName('td')[i]; i++)
      ele.style.background = (valor) ? 'yellow' : '';
  }
     
  if (document.getElementById('columnas').checked) {
    tab=document.getElementById('tabla');
    for (i=0; ele=fila.getElementsByTagName('td')[i]; i++)
      if (ele==obj) num=i
     
    for (i=0; ele=tab.getElementsByTagName('tr')[i]; i++)
      ele.getElementsByTagName('td')[num].style.background = (valor) ? 'yellow' : '';
  }
}
-->
</script>
</head>
<body onload="ini()">
<p>
Filas: <input type="checkbox" name="filas" id="filas" />
Columnas: <input type="checkbox" id="columnas" />
</p>
<table id="tabla" border="1">
<tr>
<td>1.1</td><td>1.2</td><td>1.3</td>
</tr>
<tr>
<td>2.1</td><td>2.2</td><td>2.3</td>
</tr>
<tr>
<td>3.1</td><td>3.2</td><td>3.3</td>
</tr>
</table>
</body>
</html>


Nota: Modifica las opciones que encuentres en negrilla lo demas es obligatorio tenerlo de esa forma. Si este te sirvio de ayuda deja tu comentario pulsando aqui
 
Hoy hubo 229760 visitantes (767858 clics a subpáginas) ¡Aqui en wedmasterayuda!
Inicio | Comentarios | Chatea | Foro | Zona musica | Tuturiales | Descargas | Contacto
XHTML CSS
Corporacion wedmasterayuda
Todos los derechos reservados
Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis