Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Consulta sobre un tab que me altera mi funcion javascript

Estas en el tema de Consulta sobre un tab que me altera mi funcion javascript en el foro de Frameworks JS en Foros del Web. Hola a todos, tengo una consulta, tengo un tab donde manejo dos pestañas, y me funcionan bien, el punto es que tengo dentro de un ...
  #1 (permalink)  
Antiguo 10/10/2012, 17:11
Avatar de Sumerio  
Fecha de Ingreso: octubre-2009
Mensajes: 195
Antigüedad: 11 años
Puntos: 6
Pregunta Consulta sobre un tab que me altera mi funcion javascript

Hola a todos, tengo una consulta, tengo un tab donde manejo dos pestañas, y me funcionan bien, el punto es que tengo dentro de un tab tengo dos checkbox, donde tengo una funcion javascript que activa por medio de DIV el formulario oculto, el problema es que al mostrarme, me lo da alterado, o sea me da muyo mas espacio de lo normal, es muy molesto.
El problema creo yo es la ubicacion del tab, sucede que el tab lo tengo en la misma pagina y la funcion javascript en la misma pagina.

Código:
<script type="text/javascript">

	$(document).ready(function(){
	   $("#flagRio").click(function(evento){
	      if ($("#flagRio").attr("checked")){
	         $("#capaexp1").css("display", "block");
	      }else{
	         $("#capaexp1").css("display", "none");
	      }
	   });
	});
	
	
		 
</script>

<style type="text/css">
	#capainicio{
		position:relative;
	}
	#capaexpansion1{
		position:relative;
		display:none;
	}
	#capaexpansion2{
		position:relative;
		display:none;
	}
	#capaexpansion3{
		position:relative;
		display:none;
	}
	#capaexpansion4{
		position:relative;
		display:none;
	}
	#capaexpansion5{
		position:relative;
		display:none;
	}
	#capafinal{
		position:relative;
	}
</style>


<style type="text/css">
/* tamaño y forma del panel principal */
div#panel {
	position: relative;
	width: 1180px;
	height: 600px;
}

/* configuracion de las pestañas */
ul#tabs {
	position:absolute;
	left: 0px;
	top: 0px;
	margin:0;
	padding:0;
	width: 1000px;
	height: 24px;
	z-index: 20;
}
	ul#tabs li {
		float:left;
		height: 23px;
		padding-left: 8px;
		list-style: none;
		margin-right: 1px;
		background: url(${ctx}/images/tabs.png) left -48px;
	}
	ul#tabs li.actual {
		height: 24px;
		background: url(${ctx}/images/tabs.png) left -72px;
	}
		ul#tabs li a {
			display: block;
				/* hack para ie6 */
				.display: inline-block;
				/* fin del hack */
			height: 23px;
			line-height: 23px;
			padding-right: 8px;
			outline: 0px none;
			font-family: arial;
			font-size: 10px;
			text-decoration: none;
			color: #000;
			background: url(${ctx}/images/tabs.png) right 0px;
		}
		
		ul#tabs li.actual a {
			height: 24px;
			line-height: 24px;
			background: url(${ctx}/images/tabs.png) right -24px;
			cursor: default;	
		}

/* Configuración de los paneles */
div#panel #paneles {
	position:absolute;
	left: 0px;
	top: 23px;
	width: 1180px;
	height: 600px;
	border: 1px solid #91a7b4;
	background: #fff;
	overflow: hidden;
	z-index: 10px;
}
	div#panel #paneles div {
		margin:10px;
		width: 1180px;
		height: 600px;
		font-family: arial;
		font-size: 12px;
		text-decoration: none;
		color: #000;
		overflow: auto;
	}
</style>

<script type="text/javascript">
	function tab(pestana,panel)
	{
		pst 	= document.getElementById(pestana);
		pnl 	= document.getElementById(panel);
		psts	= document.getElementById('tabs').getElementsByTagName('li');
		pnls	= document.getElementById('paneles').getElementsByTagName('div');		
		// eliminamos las clases de las pestañas
		for(i=0; i< psts.length; i++)
		{
			psts[i].className = '';
		}		
		// Añadimos la clase "actual" a la pestaña activa
		pst.className = 'actual';		
		// eliminamos las clases de las pestañas
		for(i=0; i< pnls.length; i++)
		{
			pnls[i].style.display = 'none';
		}		
		// Añadimos la clase "actual" a la pestaña activa
		pnl.style.display = 'block';
	}
	
	function grabar(){
		var f = document.forms[0];
		f.action = "${ctx}/capitulo916/save.action?forward=init";
		f.submit();
	}
</script>
  #2 (permalink)  
Antiguo 11/10/2012, 10:28
Avatar de Dradi7  
Fecha de Ingreso: junio-2008
Ubicación: Peru - Lima
Mensajes: 1.518
Antigüedad: 12 años, 4 meses
Puntos: 220
Respuesta: Consulta sobre un tab que me altera mi funcion javascript

seria bueno que pongas el html
__________________
La clave de todo triunfador es eliminar todas sus excusas y sus limitaciones
  #3 (permalink)  
Antiguo 11/10/2012, 12:45
Avatar de Sumerio  
Fecha de Ingreso: octubre-2009
Mensajes: 195
Antigüedad: 11 años
Puntos: 6
Respuesta: Consulta sobre un tab que me altera mi funcion javascript

En una pagina, lo que escuchado es que se carga primero todo el javascript y luego los stylos del jquery, de repente es ese el problema.
Un div para el tab esta encerrando todo mi formulario, y dentro aplico mi evento javascript para el chekbox.

Etiquetas: formulario, funcion, javascript, tab
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 03:53.