Hola JuanaM
:
Buenos dias. Tu código no me deja modificarlo para adaptarlo a mi proyecto
. Te explico lo que tenía antes a ver si puedes iluminar mi camino.
En la página, en el head, tengo un include que llama a este AJAX:
Código:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script>
$(function(){
$(".button").click(function(){
$('#resultado').html("Cargando...");
var valor=$(this).attr("rel");
$.ajax({
url: '../phpBits/BotonesMenuPER.php',
data: 'boton='+valor,
type: 'POST',
success: function(data){
$('#contenido').html(data);
}
});
});
});
</script>
Que le pasa los valores de estos enlaces:
Código HTML:
<div id="Pestanas">
<ul>
<li ><a href="#" rel="1" class="button">Perfil</a></li>
<li ><a href="#" rel="2" class="button">Referencias</a></li>
<li ><a href="#" rel="3" class="button">Documentos</a></li>
</ul>
</div>
a este fichero:
Código PHP:
<?php session_start ();
$boton=$_POST['boton'];
//Cambio el contenido del DIV con los botones del menu
switch ($boton){
case "1":
include ("../forms/DatosPerfilConsultor.php");
break;
case "2":
include ("../forms/Body_Form_Txt_REFCon.php");
break;
case "3":
include ("../forms/Body_Form_Txt_RGTUSERCon.php");
break;
default:
include ("../forms/DatosPerfilConsultor.php");
}
?>
Que es el que carga los contenidos del div correspondiente en la página y se combina con este CSS:
Código:
/*Menus de pestaña*/
#Pestanas{float:left;z-index:1;margin-left: 4px;width: 100%;padding-left: 5px;z-index:1}
#Pestanas ul{font: bold 11px Arial, Verdana, sans-serif;margin:0;padding:5px;list-style:none;border-radius:4px 4px 0px 0px;-moz-border-radius: 4px 4px 0px 0px;-webkit-border-radius:4px 4px 0px 0px;}
#Pestanas a{float:left;color: white;background-color: FireBrick;border:2px Solid #8b0000;margin-left: 4px;padding:5px;text-decoration:none;letter-spacing: 1px;border-radius:4px 4px 0px 0px;-moz-border-radius: 4px 4px 0px 0px;-webkit-border-radius:4px 4px 0px 0px;}
.button {display:inline;line-height: 1.5em;margin:0 0 0 0;padding:7px; border-radius:4px 4px 0px 0px;-moz-border-radius: 4px 4px 0px 0px;-webkit-border-radius:4px 4px 0px 0px;}
#Pestanas li a:hover{background-color: #d50509;border:2px Solid #8b0000;}
#Pestanas li a:focus {background:#e9e9e9;border:2px Solid #8b0000;text-decoration: none; color:FireBrick; border-bottom:2px Solid#e9e9e9;}
#Pestanas li a:active{background:#e9e9e9;border:2px Solid #8b0000; }
#Pestanasline{margin-top:7px;padding: 0;width: 100%;height: 2px;line-height: 1px;background: #8b0000;}
/*Contenido página formularios página central*/
#contenido {float:left;width: 100%;z-index:5;padding:0;margin:-2px 0 0 0; border-top:2px Solid #8b0000; border:2px Solid #8b0000;}
Esto, en general me funciona bien (no como lo que tu me has enviado
) pero con mi actual nivel de conocimientos me resulta flexible para después adaptarlo al resto de mi proyecto. Sin embargo, tu código tiene cualidades como la persistencia del enlace y la carga predeterminada de la página inicial que me resultarían muy útiles para incorporarlas al mío.
¿Serías capaz de decirme como puedo unir lo mejor de ambos mundos?
Se que no me merezco tanta atención. Pero piensa que esto mejorará mucho tu Karma y en la próxima reencarnación serás un ser aún más maravilloso
