Foros del Web » Creando para Internet » Diseño web »

Meter en tabla...lo siguiente...

Estas en el tema de Meter en tabla...lo siguiente... en el foro de Diseño web en Foros del Web. Hola Foristas, postee este mensaje en otro subtema, pero no sé si lo hice en el lugar indicado, por eso lo vuelvo a poner en ...
  #1 (permalink)  
Antiguo 03/10/2007, 19:53
Avatar de admoro  
Fecha de Ingreso: agosto-2005
Ubicación: Prov. de Bs As. Argentina
Mensajes: 432
Antigüedad: 12 años, 3 meses
Puntos: 3
Meter en tabla...lo siguiente...

Hola Foristas, postee este mensaje en otro subtema, pero no sé si lo hice en el lugar indicado, por eso lo vuelvo a poner en este nuevo espacio. Desde ya, gracias por la constante paciencia y si cometo algún error por favor háganmelo saber. Cordiales. Admoro

Tengo un problemilla. Encontré este maravilloso código en www.lawebdelrpogramador.com que es un scritp con css para hacer el efecto de pestañas en un página, pero al colocarlo me desarme el resto de la página.
¿Cómo puedo hacer para que quede dentro de una tabla de, por ejempplo, 540px de ancho? es decir, lo que busco es colocarlo en un lugar y que quede fijo, sin que me desarme el resto....es que no sé hacerlo.
Muchas gracas como siempre!!!
Sdos
Admoro

<style type="text/css">
div {clear:both;display:table;border:1px solid}
span {float:left;padding:0 5px 0 5px;}
</style>

<script type="text/javascript">
<!--
function seleccion(opc)
{
//escondemos todos los contenidos
document.getElementById("op1").style.display="none ";
document.getElementById("op2").style.display="none ";
document.getElementById("op3").style.display="none ";
switch(opc)
{
case 1:
//mostramos elcontenido de la primera opcion
document.getElementById("op1").style.display="bloc k";
break;
case 2:
//mostramos elcontenido de la segunda opcion
document.getElementById("op2").style.display="bloc k";
break;
case 3:
//mostramos elcontenido de la tercera opcion
document.getElementById("op3").style.display="bloc k";
break;
}
}
//-->
</script>

</head>

<body>
<h1>Pestañas con CSS y JavaScript</h1>
<h5>Ejemplo de la utilización de pestañas sin recargar la web, utilizando capas y javascript</h5>

<!-- pestañas -->
<div>
<span style="border-right:1px solid;"><a href='javascript:seleccion(1);'>Opción 1</a></span>
<span style="border-right:1px solid;"><a href='javascript:seleccion(2);'>Opción 2</a></span>
<span><a href='javascript:seleccion(3);'>Opción 3</a></span>
</div>

<!-- contenido de las pestañas -->
<div id="op1" style="display:block;width:400px;height:200px;">
Texto opción 1
</div>
<div id="op2" style="display:none;width:400px;height:200px;">
Texto opción 2
</div>
<div id="op3" style="display:none;width:400px;height:200px;">
Texto opción 3
</div>

<br /><p style='clear:both;text-align:center'><a href="http://www.lawebdelprogramador.com"> http://www.lawebdelprogramador.com</a></p>
</body>
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:39.