Mudanças entre as edições de "Página principal"

De wiki.eliteSoft.com.br
Ir para: navegação, pesquisa
Linha 1: Linha 1:
                          [[Arquivo:welcomewiki.png|center]]
+
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 +
<html>
 +
<head>
 +
<title>Abas</title>
 +
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 +
<style type="text/css">
 +
<!--
 +
.unsel {
 +
  border-bottom-width: thin;
 +
  border-bottom-style: solid;
 +
  border-bottom-color: #0000FF; <!-- Cor da borda da aba -->
 +
  font-style: normal;
 +
}
 +
.sel {
 +
  border-top-width: thin;
 +
  border-right-width: thin;
 +
  border-bottom-width: 0px;
 +
  border-left-width: thin;
 +
  border-top-style: solid;
 +
  border-right-style: solid;
 +
  border-bottom-style: none;
 +
  border-left-style: solid;
 +
  border-top-color: #0000FF;<!-- cor da borda da aba-->
 +
  border-right-color: #0000FF;<!-- cor da borda da aba-->
 +
  border-left-color: #0000FF;<!-- cor da borda da aba-->
 +
  font-weight: bold;
 +
  background-color: #66CCFF;<!-- cor de fundo-->
 +
}
 +
.divsel {
 +
  visibility: visible;
 +
  position: absolute;
 +
  left: 10px;<!-- distância do conteúdo em relação à esquerda do browser-->
 +
  top: 57px;<!-- distância do conteúdo em relação ao topo-->
 +
  height: 520px;<!-- altura do conteúdo-->
 +
  width: 984px;<!-- largura do conteúdo-->
 +
  background-color: #66CCFF;<!-- cor de fundo do conteúdo-->
 +
  right: 10px;
 +
  bottom: 10px;
 +
}
  
 +
.divunsel {
 +
  visibility: hidden;
 +
}
 +
-->
 +
</style>
 +
</head>
  
{|style="color:#767676; font-family:Georgia;font-size:130%; margin-left:208px"
 
|-
 
|Aqui você terá acesso aos Tutoriais, Vídeos do Integrator para auxiliar na utilização do sistema.
 
|}
 
 
 
{| style="margin-top:5px; width:60%; margin-bottom:2px; margin-left:240px"
 
|class="fundologo" style="background-repeat:no-repeat; background-position:-40px -15px; width:100%; border:1px solid #a7d7f9; vertical-align:top; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius:10px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.35)" |
 
 
{|  style="width:100%; margin-bottom:2px; vertical-align:top; font-size:95%; background:transparent;"
 
[[Arquivo:ambiente.png]]
 
|-
 
|Colspan="2" style="text-align:center"|
 
 
[[Arquivo:desktop.png|center|100px|link=Modulo_Desktop]]
 
! [[Arquivo:web.png|center|100px|link=Modulo_Web]]
 
! [[Arquivo:phone.png|center|100px|link=Modulo_Mobile]]
 
 
|-
 
! [[Modulo_Desktop| Desktop]]
 
|
 
! [[Modulo_Web|Web]]
 
 
! [[Modulo_Mobile|Mobile]]
 
 
|}
 
|}
 
 
 
{| style="margin-top:5px; width:60%; margin-bottom:2px;margin-left:240px"
 
|style="border:1px solid #a7d7f9; border-radius: 10px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.35)"|
 
{|  style="width:100%; margin-bottom:2px; vertical-align:top; font-size:95%; background:transparent;"
 
 
|-
 
|Colspan="2" style="text-align:center"|
 
 
[[Arquivo:ChangelogBlue2.png|70px|center|link=Changelog]]
 
! [[Arquivo:Glossario.jpg|60px|center|link=Glossário]]
 
! [[Arquivo:Faq.png|60px|link=Modulo_Web_-_FAQ]]
 
! [[Arquivo:Faq.png|60px|link=Modulo_Desktop_-_FAQ]]
 
! [[Arquivo:Video.jpg|60px|center|link=Videos_Tutoriais]]
 
! [[Arquivo:vocesabia.png|50px|center|link=Você sabia?]]
 
|-
 
! [[Changelog| O que há de novo?]]
 
|
 
! [[Glossário|Glossário]]
 
 
! [[Modulo Web - FAQ|FAQ-Web]]
 
 
! [[Modulo Desktop - FAQ|FAQ-Desk]]
 
 
! [[Videos_Tutoriais|Vídeos/Tutoriais]]
 
 
! [[Você sabia?]]
 
|}
 
|}
 
 
<html>
 
<head>
 
 
<body>
 
<body>
<div align="center">
+
<div align="center" id="aba">
  <a href="http://www.facebook.com/pages/Elitesoft/186816238019463">  <img alt="linkedin" src="http://www.elitesoft.com.br/images/icone_facebook.jpg"/></a>
+
  <script language="JavaScript">
<a href="http://br.linkedin.com/pub/elitesoft-inform%C3%A1tica-ltda/36/86/256"> <img alt="linkedin" src="http://www.elitesoft.com.br/images/icone_linkedin.jpg"/></a>
+
      function sel(idaba){
<a href="http://twitter.com/#!/elite_soft"> <img alt="twitter" src="http://www.elitesoft.com.br/images/icone_twitter.jpg"/></a>
+
        var aba=document.getElementById(idaba);
<a href="http://www.youtube.com/user/elitesoft2004"> <img alt="youtube" src="http://www.elitesoft.com.br/images/icone_youtube.jpg"/></a>
+
        var nAbas="5"; <!-- colocar o número de abas 1-->
 +
        for(var i="1";i<nAbas;i++){
 +
            var id="aba"+i;
 +
            document.getElementById(id).className="unsel";
 +
        }
 +
        aba.className="sel";
 +
       
 +
        for(var u="1";u<nAbas;u++){
 +
            var idt="textaba"+u;
 +
            document.getElementById(idt).className="divunsel";
 +
        }
 +
        var iddiv="text"+idaba;
 +
        document.getElementById(iddiv).className="divsel";
 +
      }
 +
  </script>
 +
  <table width="100%" border="0" align="center" cellspacing="0" id="t_abas">
 +
      <tr id="tr_abas">
 +
        <td width="16,67%" class="unsel">&nbsp;</td>
 +
        <td id="aba1" width="16,67%" class="sel" onClick="sel(this.id)">Aba 1</td><!-- colocar as abas aqui. Cuidado para não mudar as id das abas: formata: aba+número. ver exemplo-->
 +
        <td id="aba2" width="16,67%" class="unsel" onClick="sel(this.id)">Aba 2</td>
 +
        <td id="aba3" width="16,67%" class="unsel" onClick="sel(this.id)">Aba 3</td>
 +
        <td id="aba4" width="16,67%" class="unsel" onClick="sel(this.id)">Aba 4</td>
 +
        <td width="16,67%" class="unsel">&nbsp;</td>
 +
      </tr>
 +
  </table>
 
</div>
 
</div>
 +
<div id="textaba1" class="divsel">Conteúdo da aba1 aqui</div><!-- colocar aqui o conteúdo das abas. Atenção para seguir o mesmo modelo de id.-->
 +
<div id="textaba2" class="divunsel">Conteúdo da aba2 aqui</div>
 +
<div id="textaba3" class="divunsel">Conteúdo da aba3 aqui</div>
 +
<div id="textaba4" class="divunsel">Conteúdo da aba4 aqui</div>
 
</body>
 
</body>
</head>
 
 
</html>
 
</html>
 
{|
 
|- align=center
 
|[http://www3.clustrmaps.com/user/eebf594a http://www3.clustrmaps.com/stats/maps-no_clusters/wiki.elitesoft.com.br-index.php-P%25C3%25A1gina_principal-thumb.jpg]
 
|}
 

Edição das 09h57min de 26 de outubro de 2012

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> Abas

  Aba 1 Aba 2 Aba 3 Aba 4  
Conteúdo da aba1 aqui
Conteúdo da aba2 aqui
Conteúdo da aba3 aqui
Conteúdo da aba4 aqui