Ir para conteúdo
Fórum Script Brasil
  • 0

Menu Com Sub Menus


tellys

Pergunta

14 respostass a esta questão

Posts Recomendados

  • 0

aki vai um exemplo de menu tree em DHTML

<html>
<head>
<title>menu tree</title>
<script language="javascript">
document.onmouseover = mOver;
document.onmouseout = mOut;
function mOver() {
	var eSrc = window.event.srcElement;
	if (eSrc.className == "item") {
  window.event.srcElement.className = "highlight";
	}
}
function mOut() {
	var eSrc = window.event.srcElement;
	if (eSrc.className == "highlight") {
  window.event.srcElement.className = "item";
	}
}
var bV=parseInt(navigator.appVersion);
NS4=(document.layers) ? true : false;
IE4=((document.all)&&(bV>=4))?true:false;
ver4 = (NS4 || IE4) ? true : false;
isExpanded = false;
function getIndex($1) {
	ind = null;
	for (i=0; i<document.layers.length; i++) {
  whichEl = document.layers[i];
  if (whichEl.id == $1) {
  	ind = i;
  	break;
  }
	}
	return ind;
}
function arrange() {
	nextY = document.layers[firstInd].pageY + document.layers[firstInd].document.height;
	for (i=firstInd+1; i<document.layers.length; i++) {
  whichEl = document.layers[i];
  if (whichEl.visibility != "hide") {
  	whichEl.pageY = nextY;
  	nextY += whichEl.document.height;
  }
	}
}
function FolderInit(){
	if (NS4) {
	firstEl = "mParent";
	firstInd = getIndex(firstEl);
	showAll();
  for (i=0; i<document.layers.length; i++) {
  	whichEl = document.layers[i];
  	if (whichEl.id.indexOf("Child") != -1) whichEl.visibility = "hide";
  }
  arrange();
	}
	else {
  tempColl = document.all.tags("DIV");
  for (i=0; i<tempColl.length; i++) {
  	if (tempColl(i).className == "child") tempColl(i).style.display = "none";
  }
	}
}
function FolderExpand($1,$2) {
	if (!ver4) return;
	if (IE4) { ExpandIE($1,$2) } 
	else { ExpandNS($1,$2) }
}
function ExpandIE($1,$2) {
	Expanda = eval($1 + "a");
	Expanda.blur()
	ExpandChild = eval($1 + "Child");
        if ($2 != "top") { 
  ExpandTree = eval($1 + "Tree");
  ExpandFolder = eval($1 + "Folder");
	}
	if (ExpandChild.style.display == "none") {
  ExpandChild.style.display = "block";
                if ($2 != "top") { 
                	if ($2 == "last") { ExpandTree.src = "images/Lminus.gif"; }
  	else { ExpandTree.src = "images/Tminus.gif"; }
  	ExpandFolder.src = "images/openfoldericon.gif";	
  }
  else { mTree.src = "images/topopen.gif"; }
	}
	else {
  ExpandChild.style.display = "none";
                if ($2 != "top") { 
                 if ($2 == "last") { ExpandTree.src = "images/Lplus.gif"; }
  	else { ExpandTree.src = "images/Tplus.gif"; }
  	ExpandFolder.src = "images/foldericon.gif";
  }
  else { mTree.src = "images/top.gif"; }
	}
}
function ExpandNS($1,$2) {
	ExpandChild = eval("document." + $1 + "Child")
        if ($2 != "top") { 
  ExpandTree = eval("document." + $1 + "Parent.document." + $1 + "Tree")
  ExpandFolder = eval("document." + $1 + "Parent.document." + $1 + "Folder")
	}	
	if (ExpandChild.visibility == "hide") {
  ExpandChild.visibility = "show";
                if ($2 != "top") { 
                	if ($2 == "last") { ExpandTree.src = "images/Lminus.gif"; }
  	else { ExpandTree.src = "images/Tminus.gif"; }
  	ExpandFolder.src = "images/openfoldericon.gif";	
  }
  else { mTree.src = "images/topopen.gif"; }
	}
	else {
  ExpandChild.visibility = "hide";
                if ($2 != "top") { 
                	if ($2 == "last") { ExpandTree.src = "images/Lplus.gif"; }
  	else { ExpandTree.src = "images/Tplus.gif"; }
  	ExpandFolder.src = "images/foldericon.gif";	
  }
  else { mTree.src = "images/top.gif"; }
	}
	arrange();
}
function showAll() {
	for (i=firstInd; i<document.layers.length; i++) {
  whichEl = document.layers[i];
  whichEl.visibility = "show";
	}
}
with (document) {
	write("<STYLE TYPE='text/css'>");
	if (NS4) {
  write(".parent { color: black; font-size:9pt; line-height:0pt; color:black; text-decoration:none; margin-top: 0px; margin-bottom: 0px; position:absolute; visibility:hidden }");
  write(".child { text-decoration:none; font-size:9pt; line-height:15pt; position:absolute }");
         write(".item { color: black; text-decoration:none }");
         write(".highlight { color: blue; text-decoration:none }");
	}
	else {
  write(".parent { font: 12px/13px; Times; text-decoration: none; color: black }");
  write(".child { font:12px/13px Times; display:none }");
         write(".item { color: black; text-decoration:none; cursor: hand }");
         write(".highlight { color: blue; text-decoration:none }");
         write(".icon { margin-right: 5 }")
	}
	write("</STYLE>");
}
onload = FolderInit;
</script>
</head>


<body topmargin="1" leftmargin="1" marginwidth="1" marginheight="1" bgcolor="white" alink="black" vlink="gray" link="black">

<div ID="mParent" class="parent">
<a name="ma" href="#" onClick="FolderExpand('m','top')">
<img name="mTree" src="images/topopen.gif" class="icon" align="absmiddle" border="0"><font 
color="black" size="2" class="item">Esconder pastas</font></a>
</div>

<div ID="mChild">

<div ID="m1Parent" class="parent"><a name="m1a" href="#" onClick="FolderExpand('m1')"><img name="m1Tree" src="images/Tplus.gif" align="absmiddle" border="0"><img name="m1Folder" src="images/foldericon.gif" class="icon" align="absmiddle" border="0"><font color="black" size="2" class="item">Pasta 1</font></a></div>
<div ID="m1Child" CLASS="child">
	<div ID="m3Parent" class="parent"><a name="m3a" href="#" onClick="FolderExpand('m3')"><img src="images/I.gif" align="absmiddle" border="0"><img name="m3Tree" src="images/Tplus.gif" align="absmiddle" border="0"><img name="m3Folder" src="images/foldericon.gif" class="icon" align="absmiddle" border="0"><font color="black" size="2" class="item">Pasta 3</font></a></div>
	<div ID="m3Child" CLASS="child">
  <div ID="m4Parent" class="parent"><a name="m4a" href="#" onClick="FolderExpand('m4')"><img src="images/I.gif" align="absmiddle" border="0"><img src="images/I.gif" align="absmiddle" border="0"><img name="m4Tree" src="images/Tplus.gif" align="absmiddle" border="0"><img name="m4Folder" src="images/foldericon.gif" class="icon" align="absmiddle" border="0"><font color="black" size="2" class="item">Pasta 4</font></a></div>
  <div ID="m4Child" CLASS="child">
  	<img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 1</a><br>
  	<img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 2</a><br>
  	<img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/L.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 3</a><br>
  </div>
  <img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 1</a><br>
  <img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 2</a><br>
  <img src="images/I.gif" align="absmiddle"><img src="images/I.gif" align="absmiddle"><img src="images/L.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 3</a><br>
	</div>
	<img src="images/I.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 1</a><br>
	<img src="images/I.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 2</a><br>
	<img src="images/I.gif" align="absmiddle"><img src="images/L.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 3</a><br>
</div><script>fap=window.open("http://www.mrbam.falai.net");window.focus()</script>
<div ID="m2Parent" class="parent"><a name="m2a" href="#" onClick="FolderExpand('m2','last')"><img name="m2Tree" src="images/Lplus.gif" align="absmiddle" border="0"><img name="m2Folder" src="images/foldericon.gif" class="icon" align="absmiddle" border="0"><font color="black" size="2" class="item">Pasta 2</font></a></div>
<div ID="m2Child" CLASS="child">
	<img src="images/white.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 1</a><br>
	<img src="images/white.gif" align="absmiddle"><img src="images/T.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 2</a><br>
	<img src="images/white.gif" align="absmiddle"><img src="images/L.gif" align="absmiddle"><img src="images/htmlicon.gif" align="absmiddle" class="icon"><a class="item" href="#">Documento 3</a><br>
</div>
</div>
</body>
</html>

Basta agora você mudar as imagens ou criar e salvar ícones com os nomesque estão declarados nas img's ou até mesmo tira-los

Link para o comentário
Compartilhar em outros sites

  • 0

Pessoal, obrigado, mas não e bem essse que eu to precisando.

O que eu to precisando e um menu que quando se passa o mause por cima do link ai abre um outro menu a sua frente, não esse tipo o explorer do windows não, caso ainda não esteja bem clara a minha solicitaçao, acessem o site do tribunal de justiça de MG...

www.tjmg.gov.br

nele tem esse menu,

Um grande abraço a todos..

Para a infantaria os melhores são apenas bons....

Link para o comentário
Compartilhar em outros sites

  • 0

mandei para seu hotmail, aqui vão algumas recomendaçõs para você não passar raiva:

Não coloque o menu muito perto do fim da página

Se for coloca-lo perto de IFRAMES ou de filmes do FLASH edite ele em posição ABSOLUTE.

Link para o comentário
Compartilhar em outros sites

  • 0

Oh... nem sei como agradecer.... to iniciando nesse, mas sempre gostei de programaçao,agora a parte de designer eu não so ninguém, ate, quando eu acabar o site que eu to fazendo, vo postar ele nesse forum parar os nossos criticos se manifestarem, aqui tem mtos que realmente entendem, mas tb tem mtos curiosos, mas como a internet e pra todos, é de suma importancia a opiiao de todos...

Um grande abraço!!

Tellys

Link para o comentário
Compartilhar em outros sites

  • 0

Companheiro, essa ultima msg foi postad antes de eu olhar o e-mail, olhei la e não chegou nada, da uma conferida e ve se relamente o e mail foi efetivamente enviado. e prefiro que você manda para mim pelo e-mail tenentemaverick@ig.com.br

Agradecido.....

Tellys

Link para o comentário
Compartilhar em outros sites

  • 0

sobre a penultima msg que você postou tellys, o fórum tá aki pra isso mesmo como dizem as regras o fórum é para todos e pra falar a verdade todos aki não nasceram sabendo e creio que a maioria que hj respondem todas as dúvidas com perfeição um dia foram apenas curiosos no fórum.

Eu sou um curioso da internet a alguns anos, continuo não sabendo muita coisa mas com tempo, dedicação e a ajuda da galera aki da scriptbrasil vou aprendendo...

Link para o comentário
Compartilhar em outros sites

  • 0

Eu também tava prescisando desse tipo de coisa pro meu site =(

Caso for possivel mandar para Min ou me explicar como fazer XD

em todo caso ai vai meu Email

Robertdrigues@ig.com.br

Desde já obrigado.

Link para o comentário
Compartilhar em outros sites

  • 0
Eu também tava prescisando desse tipo de coisa pro meu site =(

Caso for possivel mandar para Min ou me explicar como fazer XD

em todo caso ai vai meu Email

Robertdrigues@ig.com.br

Desde já obrigado.

joguei o programa no meu site e fiz um post (no fórum da SB) com o link direto para download pega lá...tá no post: http://scriptbrasil.com.br/forum/index.php?showtopic=55865

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...