Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

xanburzum

[Resolvido] Tabbed interface

Por , em ASP Clássico

Recommended Posts

xanburzum    169

xanburzum
Postado

Criando uma interface Tabbed:

 

<%

Option Explicit

' definição Tabs 
dim tabsDef (6,2)
 ' primeiro índice define quantos separadores terá, 6, neste caso
 ' O segundo índice permanece em 2, para o 2 atributos cada guia terá 
 ' 'Atributos: 1 = rótulo: o Displayed Label, 2 = gráfica: um ícone para o local antes da Label
dim startTab
tabsDef(1,1)="General"
tabsDef(1,2)=""
tabsDef(2,1)="Security"
tabsDef(2,2)="lock.gif"
tabsDef(3,1)="Content"
tabsDef(3,2)=""
tabsDef(4,1)="Connections"
tabsDef(4,2)=""
tabsDef(5,1)="Programs"
tabsDef(5,2)=""
tabsDef(6,1)="Advanced"
tabsDef(6,2)=""
startTab=3 'valor usado por <BODY onload> para determinar qual o separador para exibir primeiro.

' Settings
dim tableWidth
dim BackGroundColor
dim TabColor_Ghost
tableWidth="100%"
BackgroundColor="lightgrey" ' esta será a cor de fundo do Conteúdo Seção, bem como a participação activa na guia
TabColor_Ghost="darkgray" ' cor de fundo das abas inativas

%>

<html>
<head>
 <title>Interface Tabbed </title>

<script language="javascript">
 function showTab(tabnum)
  {
// ocultar todas as secções guia conteúdo e, em seguida, mostrar o conteúdo selecionado secção

   for (i=1;i<=<%=uBound(tabsDef)%>;i++)
	{
	 tabName='tabContent' + i;
	 eval(tabName + '.style.display="none"');
	 tabName='tabLabel' + i;
	 eval(tabName + '.style.backgroundColor="<%=TabColor_Ghost%>"');
	 eval(tabName + '.style.fontWeight="normal"');
	 undName='tabUnderline' + i;
	 eval(undName + '.style.backgroundColor="white"');
	}
   tabName='tabContent' + tabnum;
   eval(tabName + '.style.display="block"');
   tabName='tabLabel' + tabnum;
   eval(tabName + '.style.backgroundColor="<%=BackgroundColor%>"');
   eval(tabName + '.style.fontWeight="bold"');
   undName='tabUnderline' + tabnum;
   eval(undName + '.style.backgroundColor="<%=BackgroundColor%>"');
  }
</script>
</head>

<body bgColor="lightgrey" onLoad="showTab(<%=startTab%>);">

<%

drawTabs

startContentSection

startTabContent(1)
response.write("   <table>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td>News</td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td><font size=2>aDobra o número de casos suspeitos de gripe suína no Brasil
Número de casos suspeitos passou de 7 para 14 em 24 horas.
Segundo o Ministério da Saúde, 37 casos estão sendo monitorados.
</font></td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("   </table>" & chr(13))
endTabContent

startTabContent(2)
response.write("   <table>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td>Peixe campeão</td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td><font size=2>Para ser campeão paulista, domingo, o Santos precisa vencer o Corinthians por três gols. E para conseguir essa façanha não basta apenas jogar por jogar. Para o técnico Vagner Mancini, do Peixe, é preciso que os seus jogadores entrem em campo como se fossem disputar os últimos jogos de suas carreiras. Ele quer guerreiros e não apenas jogadores de futebol. 
O Santos só tem chance de virar o jogo se colocar a alma em campo, se jogar como superação, com garra, com vontade - afirma o treinador. </font></td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("   </table>" & chr(13))
endTabContent

startTabContent(3)
response.write("   <table>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td>Como avaliar a nota da sua escola</td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td><font size=2>As notas do Enem variam de 0 a 100, mas elas não estão atreladas a faixas consideradas de qualidade excelente, boa, média ou ruim. Uma nota 50, por exemplo, não quer dizer que essa é uma escola “na média”. Para entender o que a nota diz sobre aquela escola, é preciso compará-la com o quadro geral daquela rede (privada ou pública) de certo estado. Para facilitar esse trabalho, ÉPOCA criou um sistema no qual você entende a posição da sua escola dentro da rede particular do seu estado. </font></td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("   </table>" & chr(13))
endTabContent

startTabContent(4)
response.write("   <table>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td>Qual é o sexo do seu cérebro?</td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td><font size=2>As diferenças no corpo de homens e mulheres estão além da aparência e dos órgãos sexuais. A ciência detectou que até o cérebro apresenta características femininas ou masculinas. Essa diferença neurológica gera diferenças de comportamentos, sentimentos e modos de pensar entre homens e mulheres. 
</font></td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("   </table>" & chr(13))
endTabContent

startTabContent(5)
response.write("   <table>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td>Windows 7 RC </td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td><font size=2>O Windows 7 é o sucessor do Windows Vista, e será lançado neste ano. Ele continua em testes, e no início deste ano nós publicamos um pequeno review de duas páginas com as principais novidades da versão beta. Há também um interessante comparativo de performance com o Windows Vista.

Agora a Microsoft disponibilizou uma versão muito mais completa e estável: a Release Candidate (RC), que é uma fase bastante avançada de testes, indicando que o produto está quase pronto. A diferença entre esta versão e a versão final do produto são pequenas correções de bugs.</font></td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("   </table>" & chr(13))
endTabContent

startTabContent(6)
response.write("   <table>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td>Windows 7: o que mudou do Beta para o RC?
</td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("	<tr>" & chr(13))
response.write("	 <td><font size=2>Mudanças no AutoRun 
O AutoRun, que é usado para iniciar programas automaticamente a partir de um CD, DVD ou outro tipo de mídia inserida no computador, foi desativado para dispositivos de armazenamento não óticos (qualquer coisa menos CDs ou DVDs) foi removido. Isso ajudará a proteger os usuários contra worms e outros tipos de malware. </font></td>" & chr(13))
response.write("	</tr>" & chr(13))
response.write("   </table>" & chr(13))
endTabContent

endContentSection

sub startTabContent(tabNumber)
 response.write("   <div name=""tabContent" & tabNumber & """ id=""tabContent" & tabNumber & """ style=""display=none;"">" & chr(13))
end sub

sub endTabContent
 response.write("   </div>" & chr(13))
end sub

sub startContentSection
 response.write("<table border=0 cellspacing=0 cellpadding=0 bgcolor=" & BackgroundColor & " width=""" & tableWidth & """>" & chr(13))
 response.write(" <tr>" & chr(13))
 response.write(" <td width=2 bgcolor=white><img src=white.gif border=0 width=2 height=""100%""></td>")
 response.write("  <td><font face=""verdana, arial"" size=2>" & chr(13))
end sub

sub endContentSection
 response.write("  </td>" & chr(13))
 response.write(" <td width=2 bgcolor=black><img src=black.gif border=0 width=2 height=""100%""></td>")
 response.write(" </tr>" & chr(13))
 response.write(" <tr>" & chr(13))
 response.write("  <td width=2 bgcolor=white><img src=white.gif border=0 width=2 height=""100%""></td>")
 response.write("  <td align=center><br><input type=""button"" value=""Aplicar estas definições"" onClick=""alert('Este programa não Salva Tudo.');""><br><br></td>")
 response.write("  <td width=2 bgcolor=black><img src=black.gif border=0 width=2 height=""100%""></td>")
 response.write(" </tr>" & chr(13))
 response.write(" <tr>" & chr(13))
 response.write("  <td colspan=3 height=2 bgcolor=black></td>")
 response.write(" </tr>" & chr(13))
 response.write("</table>" & chr(13))
end sub

sub drawTabs
 dim tabCounter
 response.write("<table border=0 cellspacing=0 cellpadding=0 width=""" & tableWidth & """>" & chr(13))
 response.write(" <tr>" & chr(13))
 response.write(" <td></td>") 
 for tabCounter=1 to uBound(tabsDef)
  response.write(" <td colspan=3 height=""100%"" bgcolor=white></td>")
 next
 response.write(" </tr>" & chr(13))
 response.write(" <tr vAlign=top>" & chr(13))
 response.write(" <td> </td>") 
 for tabCounter=1 to uBound(tabsDef)
  response.write(" <td width=1 bgcolor=white><img src=white.gif border=0 width=1 height=""100%""></td>")
  response.write(" <td name=""tabLabel" & tabCounter & """ id=""tabLabel" & tabCounter & """ style=""cursor:hand;font-weight:normal;"" onclick=""showTab('" & tabCounter & "');"" bgcolor=" & TabColor_Ghost & "><font face=""verdana, arial"" size=2> ")
  if not tabsDef(tabCounter,2)="" then
  response.write("<img src=""" & tabsDef(tabCounter,2) & """ align=middle border=0> ")
  end if
  response.write(replace(tabsDef(tabCounter,1)," "," ") & " </font></td>")
  response.write(" <td width=1 bgcolor=black><img src=black.gif border=0 width=1 height=""100%""></td>")
 next
 response.write(" </tr>" & chr(13))
 response.write(" <tr>" & chr(13))
 response.write(" <td height=2 bgcolor=white></td>") ' creates the leader space
 for tabCounter=1 to uBound(tabsDef)
  response.write(" <td height=2 bgcolor=white></td>")
  response.write(" <td height=2 bgcolor=white name=""tabUnderline" & tabCounter & """ id=""tabUnderline" & tabCounter & """ ></td>")
  response.write(" <td height=2 bgcolor=white></td>")
 next
 response.write(" <td width=""100%"" height=1 bgcolor=white></td>")
 response.write(" </tr>" & chr(13))
 response.write("</table>" & chr(13))
end sub
%>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos ASP Clássico
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito