To usando um sistema de links em abas.
E o sistema entra direto na pagina Principal, mas quando clico o link Cadastros não identifica que está naquele link segue os arquivos. Não sei vão conseguir intender o que eu estou tentando explicar mas se executarem esses arquivos vão intender o que eu quero fazer, o importante é o style.css que está as configurações do index.php
index.php
[codebox]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR...D/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Qualy SIS</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="menu.js"></script>
</head>
<body>
<div id="geral">
<h1 align="left">Qualy SIS</h1><h3 align="right">Sistema de Orçamento Facilitado</h3>
<div id="menu">
<ul>
<li class="primeira"><a href="#" onclick="navegar('conteudo.php')"class="selecionado">Principal</a></li>
<li><a href="#" onclick="navegar('cadastros/cadastros.php')">Cadastros</a></li>
<li><a href="#" onclick="navegar('contato/contato.php')">Contato</a></li>
</ul>
</div>
<div id="conteudo">
<?php include('conteudo.php');?>
</div>
<div id="rodape">Copyright © 2008 - <a href="http://danieldocki.c...ki.com/">Daniel Docki</a></div>
</div>
</body>
</html>[/codebox]
style.css
[codebox]* { margin: 0; padding: 0; }
body {
text-align: center;
font: 70% "Trebuchet MS", Verdana, Arial, Tahoma;
background-color: #F1F1F1;
color: #666666;
}
ul { list-style: none; }
p { margin-bottom: 10px; }
h1 { margin-bottom: 5px; color: #f1ad2b; font-size: 180%; }
h2 { margin-bottom: 2px; color: #81C281; font-size: 150%; }
h3 { color: #709AFE; font-size: 130%; }
#geral {
margin: 10px auto;
width: 750px;
text-align: left;
}
#menu ul { height: 1%; display: table; }
#menu ul li { float: left; margin: 0 4px; }
#menu ul li.primeira { margin-left: 0; }
#menu ul li a {
display: block;
float: left;
padding: 5px 12px;
background-color: #f1ad2b;
color: #FFFFFF;
font-weight: bold;
}
#menu ul li a.selecionado, #menu ul li a:hover { background-color: #f1e0b2; color: #999999; text-decoration: none; }
#conteudo { background-color: #f1e0b2; color: #666666; padding: 10px; }
#rodape { text-align: center; padding: 10px; }
#rodape a { color: #54A4FC; }
#rodape a:hover { text-decoration: none; }[/codebox]
menu.js
[codebox]function ObjAjax(){
try{return new XMLHttpRequest()}
catch(e){try{return new ActiveXObject("Msxml2.XMLHTTP")}
catch(e){return new ActiveXObject("Microsoft.XMLHTTP")}}
return null;
}
function navegar(page){
ajax = new ObjAjax();
var div = document.getElementById("conteudo");
ajax.onreadystatechange = function(){
if(ajax.readyState == 1){div.innerHTML="Carregando...";}
if(ajax.readyState == 4){div.innerHTML=ajax.responseText;}
}
ajax.open("GET",page,true);
ajax.send(null);
}[/codebox]
Edição feita por: § Kenshin §, 09/01/2008, 02:47.
para codigos longos use o [codebox].
