Menu com animação
Menu bem simples com uma animação bem legal. Compatível com o IE e Firefox.
Enviado em 04 de Janeiro de 2009 por pitiko
JavaScript > Menu
EU QUERIA SABER COMO FAZ PRA COLOCAR MAIS SUB MENU EM CADA MENU!
OBRIGADA
1
menu com sub menu
Criado por mirtesmix, Aug 15 2010 11:39 AM
4 respostas neste tópico
#1
mirtesmix
-
- Membros
-
- 3 posts
Postado 15 August 2010 - 11:39 AM
BAIXEI ESTE SCRIPT:
Menu com animação
Menu bem simples com uma animação bem legal. Compatível com o IE e Firefox.
Enviado em 04 de Janeiro de 2009 por pitiko
JavaScript > Menu
EU QUERIA SABER COMO FAZ PRA COLOCAR MAIS SUB MENU EM CADA MENU!
OBRIGADA
Menu com animação
Menu bem simples com uma animação bem legal. Compatível com o IE e Firefox.
Enviado em 04 de Janeiro de 2009 por pitiko
JavaScript > Menu
EU QUERIA SABER COMO FAZ PRA COLOCAR MAIS SUB MENU EM CADA MENU!
OBRIGADA
#2
pitiko
-
- Moderadores
-
- 939 posts
Postado 16 August 2010 - 05:29 PM
Já coloquei uma versão com submenu's neste link: http://www.codigofonte.net/scripts-1714/menu-com-animacao-20
By piTiko
#3
mirtesmix
-
- Membros
-
- 3 posts
Postado 18 August 2010 - 09:04 AM
OI, PITIKO!
BOM DIA!
EU BAIXEI O CÓDIGO DO MENU COM ANIMAÇÃO, MAS COMO EU NÃO ENTENDO NADA DE CÓDIGO FONTE, MEXI EM TUDO E NÃO CONSEGUI FAZER ELE FICAR IGUAL AO SEU.
EU USO O DREAMWEAVER, SEMPRE PEGO OS CÓDIGOS PRONTOS, COLOCO A PARTE DE CSS E JS ENTRE OS HEAD
E O DIV EU COLOCO DENTRO DA TABELA.
NÃO TEM COMO VOCÊ ME MANDAR ELE PRONTO? A PARTE DE CSS E JS JUNTOS PRA COLOCAR NO HEAD E O RESTANTE, COM AQUELE MONTE DE MENU, SUB MENU E SUBSUB MENU. VOCÊ ME MANDANDO ELE PRONTO, EU VOU MEXENDO ATÉ FICAR COMO EU PRECISO. EU TENHO ESSE ABAIXO, MAS QUERIA UM IGUAL O SEU!
COLOCAR NO HEAD
<style type="text/css">
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 160px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
}
.suckerdiv ul li{
position: relative;
}
/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 170px; /*sub menu width*/
top: 0;
visibility: hidden;
}
/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: black;
text-decoration: none;
background: #fff;
padding: 1px 5px;
border: 1px solid #ccc;
border-bottom: 0;
}
.suckerdiv ul li a:visited{
color: black;
}
.suckerdiv ul li a:hover{
background-color: yellow;
}
.suckerdiv .subfolderstyle{
background: url(media/arrow-list.gif) no-repeat center right;
}
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */
</style>
<script type="text/javascript">
//SuckerTree Vertical Menu 1.1 (Nov 8th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/
var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas
function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
else //else if this is a sub level submenu (ul)
ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
ultags[t].style.visibility="visible"
ultags[t].style.display="none"
}
}
}
if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)
</script>
COLOCAR NA TABELA
<div class="suckerdiv">
<ul id="suckertree1">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Folder 1</a>
<ul>
<li><a href="#">Sub Item 1.1</a></li>
<li><a href="#">Sub Item 1.2</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Sub Item 2.1.3</a></li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Item 4</a></li>
</ul>
</div>
OBRIGADA POR ENQUANTO,
MIRTES
BOM DIA!
EU BAIXEI O CÓDIGO DO MENU COM ANIMAÇÃO, MAS COMO EU NÃO ENTENDO NADA DE CÓDIGO FONTE, MEXI EM TUDO E NÃO CONSEGUI FAZER ELE FICAR IGUAL AO SEU.
EU USO O DREAMWEAVER, SEMPRE PEGO OS CÓDIGOS PRONTOS, COLOCO A PARTE DE CSS E JS ENTRE OS HEAD
E O DIV EU COLOCO DENTRO DA TABELA.
NÃO TEM COMO VOCÊ ME MANDAR ELE PRONTO? A PARTE DE CSS E JS JUNTOS PRA COLOCAR NO HEAD E O RESTANTE, COM AQUELE MONTE DE MENU, SUB MENU E SUBSUB MENU. VOCÊ ME MANDANDO ELE PRONTO, EU VOU MEXENDO ATÉ FICAR COMO EU PRECISO. EU TENHO ESSE ABAIXO, MAS QUERIA UM IGUAL O SEU!
COLOCAR NO HEAD
<style type="text/css">
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 160px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
}
.suckerdiv ul li{
position: relative;
}
/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 170px; /*sub menu width*/
top: 0;
visibility: hidden;
}
/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: black;
text-decoration: none;
background: #fff;
padding: 1px 5px;
border: 1px solid #ccc;
border-bottom: 0;
}
.suckerdiv ul li a:visited{
color: black;
}
.suckerdiv ul li a:hover{
background-color: yellow;
}
.suckerdiv .subfolderstyle{
background: url(media/arrow-list.gif) no-repeat center right;
}
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */
</style>
<script type="text/javascript">
//SuckerTree Vertical Menu 1.1 (Nov 8th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/
var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas
function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
else //else if this is a sub level submenu (ul)
ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
ultags[t].style.visibility="visible"
ultags[t].style.display="none"
}
}
}
if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)
</script>
COLOCAR NA TABELA
<div class="suckerdiv">
<ul id="suckertree1">
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Folder 1</a>
<ul>
<li><a href="#">Sub Item 1.1</a></li>
<li><a href="#">Sub Item 1.2</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Sub Item 2.1.3</a></li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Item 4</a></li>
</ul>
</div>
OBRIGADA POR ENQUANTO,
MIRTES
#4
pitiko
-
- Moderadores
-
- 939 posts
Postado 18 August 2010 - 04:38 PM
Pera.. não entendi, você quer que eu coloque o JavaScript e o CSS numa arquivo só? Que seria no HTML?
By piTiko
#5
mirtesmix
-
- Membros
-
- 3 posts
Postado 18 August 2010 - 09:12 PM
OI, PITIKO!
MEU GRANDE PROBLEMA É QUE NÃO ENTENDO NADA DE NADA, MUITO MENOS DE CSS E JS, NEM SEI COMO MEXO NO DREAMWEAVER, MAS TAMBÉM SÓ FAÇO O BÁSICO. COMO SOU MUITO BURRINHA, PRECISO DE CÓDIGOS PRONTOS!
ENTREI LÁ NO SEU LINK, ENCONTREI UM MENU HORIZONTAL, MAS DEI MAIS UMAS VOLTINHAS NA NET E ENCONTREI ISSO AQUI: (FIZ UMAS MUDANÇAS NAS CORES PRA COMBINAR COM MEU SITE, O ORIGINAL TAVA VERMELHO DEMAIS )
<html>
<head>
<title>Untitled</title>
<!--|||||=========== COLOQUE ENTRE AS TAGS HEAD ==========|||||||||| -->
<!-- ||**||**||**|| FOLHA DE ESTILOS (CSS) ||**||**||**|| -->
<style type="text/css">
/*+++++++++++++++ RELATIVO AS CATEGORIAS +++++++++++++++++++++*/
/**** LINKS DOS NOMES DAS CATEGORIAS ****/
/* Link em estado natural*/
a.link_menu:link{color:navy;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link depois de visitado*/
a.link_menu:visited{color:navy;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link ao passar o mouse*/
a.link_menu:hover{color:#ffffff;text-decoration:underline;font-weight:bold;font-family:arial;font-size:12px}
/**** FIM LINKS DOS NOMES DAS CATEGORIAS ****/
/**** CELULAS DOS NOMES DAS CATEGORIAS ****/
/*padding top right bottom left */
.titulo_menu{
background-color:red;
background-image:url(none);
width:150px;
height:25px;
border:1px solid blue;
padding: 5px 0px 0px 5px;
}
/**** FIM CELULAS DOS NOMES DAS CATEGORIAS ****/
/*++++++++++++ FIM RELATIVO AS CATEGORIAS +++++++++++++++++++++*/
/*++++++++++++ RELATIVO AS SUB-CATEGORIAS +++++++++++++++++++++*/
/**** LINKS DOS NOMES DAS SUB-CATEGORIAS ****/
/* Link em estado natural*/
a.link_smenu:link{color:#ffffff;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link depois de visitado*/
a.link_smenu:visited{color:#ffffff;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link ao passar o mouse*/
a.link_smenu:hover{color:navy;text-decoration:underline;font-weight:bold;font-family:arial;font-size:12px}
/**** LINKS DOS NOMES DAS SUB-CATEGORIAS ****/
/**** CELULAS DOS NOMES DAS SUB-CATEGORIAS ****/
/*padding top right bottom left */
.itens_menu{
background-color:blue;
background-image:url(none);
width:137px;
height:25px;
border:1px solid red;
padding: 5px 0px 0px 5px;
}
/**** FIM CELULAS DOS NOMES DAS SUB-CATEGORIAS ****/
/**** CELULAS DE REVEZAMENTO DOS NOMES DAS SUB-CATEGORIAS ****/
.itens_menu_r{
background-color:#0099ff;
background-image:url(none);
width:137px;
height:25px;
border:1px solid red;
padding: 5px 0px 0px 5px;
}
/**** FIM CELULAS DE REVEZAMENTO DOS NOMES DAS SUB-CATEGORIAS ****/
/*++++++++++++ FIM RELATIVO AS SUB-CATEGORIAS +++++++++++++++++++++*/
</style>
<!-- ||**||**||** FIM FOLHA DE ESTILOS (CSS) ||**||**||** -->
<!-- |||||||||||||||| FUNÇÕES JAVASCRIPT (NÃO EDITE) |||||||||||||||| -->
<script language="javascript">
c=0
du="";
function escondediv(dv,n){
for(i=1;i<=n;i++){
if(i==dv ){
if(du!=dv){
document.getElementById('mdiv'+i).style.display="inline"
du=dv
}else{
du=""
document.getElementById('mdiv'+i).style.display="none"
}
}else{
document.getElementById('mdiv'+i).style.display="none"
}
}
}
function reveza(qq){
document.getElementById(qq).className="itens_menu_r"
}
function volta(qq){
document.getElementById(qq).className="itens_menu"
}
</script>
<!-- ||||||||||||| FIM FUNÇÕES JAVASCRIPT (NÃO EDITE) |||||||||||||||| -->
<!--|||||========== FIM COLOQUE ENTRE AS TAGS HEAD =========|||||||||| -->
</head>
<body>
<!--||||||||||||||||| COLOQUE DENTRO AS TAGS BODY||||||||||||||||||||||||||||| -->
<script>
//Coloque aqui o número de itens de menu
n_divs='5'
</script>
<div class="titulo_menu"><a href="#" class="link_menu" target="alvo">Link fixo</a></div>
<div class="titulo_menu" ><a href="java script:void(escondediv('1',n_divs))" class="link_menu" >Categoria 1</a></div>
<div id="mdiv1" style="display:none">
<table border="0">
<tr><td id="um" class="itens_menu" ><a href="#" onmouseover="reveza('um')" onmouseout="volta('um')" class="link_smenu" target="alvo">link item1A</a></td></tr>
<tr><td class="itens_menu" ><a href="#" class="link_smenu" target="alvo">link item2A</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3A</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('2',n_divs))" class="link_menu">Categoria 2</a></div>
<div id="mdiv2" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item1B</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item2B</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3B</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('3',n_divs))" class="link_menu">Categoria 3</a></div>
<div id="mdiv3" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item1C</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item2C</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3C</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('4',n_divs))" class="link_menu">Categoria 4</a></div>
<div id="mdiv4" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item1D</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item2D</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3D</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('5',n_divs))" class="link_menu">Categoria 5</a></div>
<div id="mdiv5" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu">link item1E</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu">link item2E</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu">link item3E</a></td></tr>
</table>
</div>
<!--||||||||||||||||| COLOQUE DENTRO AS TAGS BODY||||||||||||||||||||||||||||| -->
</body>
</html>
FICOU XIQUE NOS ÚRTIMO!
AGRADEÇO POR DEMAIS A SUA AJUDA!
QUANDO PRECISAR EU VOLTO!
BEIJOS LINDINHO!
TÉ MAIS!
MIRTES
MEU GRANDE PROBLEMA É QUE NÃO ENTENDO NADA DE NADA, MUITO MENOS DE CSS E JS, NEM SEI COMO MEXO NO DREAMWEAVER, MAS TAMBÉM SÓ FAÇO O BÁSICO. COMO SOU MUITO BURRINHA, PRECISO DE CÓDIGOS PRONTOS!
ENTREI LÁ NO SEU LINK, ENCONTREI UM MENU HORIZONTAL, MAS DEI MAIS UMAS VOLTINHAS NA NET E ENCONTREI ISSO AQUI: (FIZ UMAS MUDANÇAS NAS CORES PRA COMBINAR COM MEU SITE, O ORIGINAL TAVA VERMELHO DEMAIS )
<html>
<head>
<title>Untitled</title>
<!--|||||=========== COLOQUE ENTRE AS TAGS HEAD ==========|||||||||| -->
<!-- ||**||**||**|| FOLHA DE ESTILOS (CSS) ||**||**||**|| -->
<style type="text/css">
/*+++++++++++++++ RELATIVO AS CATEGORIAS +++++++++++++++++++++*/
/**** LINKS DOS NOMES DAS CATEGORIAS ****/
/* Link em estado natural*/
a.link_menu:link{color:navy;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link depois de visitado*/
a.link_menu:visited{color:navy;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link ao passar o mouse*/
a.link_menu:hover{color:#ffffff;text-decoration:underline;font-weight:bold;font-family:arial;font-size:12px}
/**** FIM LINKS DOS NOMES DAS CATEGORIAS ****/
/**** CELULAS DOS NOMES DAS CATEGORIAS ****/
/*padding top right bottom left */
.titulo_menu{
background-color:red;
background-image:url(none);
width:150px;
height:25px;
border:1px solid blue;
padding: 5px 0px 0px 5px;
}
/**** FIM CELULAS DOS NOMES DAS CATEGORIAS ****/
/*++++++++++++ FIM RELATIVO AS CATEGORIAS +++++++++++++++++++++*/
/*++++++++++++ RELATIVO AS SUB-CATEGORIAS +++++++++++++++++++++*/
/**** LINKS DOS NOMES DAS SUB-CATEGORIAS ****/
/* Link em estado natural*/
a.link_smenu:link{color:#ffffff;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link depois de visitado*/
a.link_smenu:visited{color:#ffffff;text-decoration:none;font-weight:normal;font-family:arial;font-size:12px}
/* Link ao passar o mouse*/
a.link_smenu:hover{color:navy;text-decoration:underline;font-weight:bold;font-family:arial;font-size:12px}
/**** LINKS DOS NOMES DAS SUB-CATEGORIAS ****/
/**** CELULAS DOS NOMES DAS SUB-CATEGORIAS ****/
/*padding top right bottom left */
.itens_menu{
background-color:blue;
background-image:url(none);
width:137px;
height:25px;
border:1px solid red;
padding: 5px 0px 0px 5px;
}
/**** FIM CELULAS DOS NOMES DAS SUB-CATEGORIAS ****/
/**** CELULAS DE REVEZAMENTO DOS NOMES DAS SUB-CATEGORIAS ****/
.itens_menu_r{
background-color:#0099ff;
background-image:url(none);
width:137px;
height:25px;
border:1px solid red;
padding: 5px 0px 0px 5px;
}
/**** FIM CELULAS DE REVEZAMENTO DOS NOMES DAS SUB-CATEGORIAS ****/
/*++++++++++++ FIM RELATIVO AS SUB-CATEGORIAS +++++++++++++++++++++*/
</style>
<!-- ||**||**||** FIM FOLHA DE ESTILOS (CSS) ||**||**||** -->
<!-- |||||||||||||||| FUNÇÕES JAVASCRIPT (NÃO EDITE) |||||||||||||||| -->
<script language="javascript">
c=0
du="";
function escondediv(dv,n){
for(i=1;i<=n;i++){
if(i==dv ){
if(du!=dv){
document.getElementById('mdiv'+i).style.display="inline"
du=dv
}else{
du=""
document.getElementById('mdiv'+i).style.display="none"
}
}else{
document.getElementById('mdiv'+i).style.display="none"
}
}
}
function reveza(qq){
document.getElementById(qq).className="itens_menu_r"
}
function volta(qq){
document.getElementById(qq).className="itens_menu"
}
</script>
<!-- ||||||||||||| FIM FUNÇÕES JAVASCRIPT (NÃO EDITE) |||||||||||||||| -->
<!--|||||========== FIM COLOQUE ENTRE AS TAGS HEAD =========|||||||||| -->
</head>
<body>
<!--||||||||||||||||| COLOQUE DENTRO AS TAGS BODY||||||||||||||||||||||||||||| -->
<script>
//Coloque aqui o número de itens de menu
n_divs='5'
</script>
<div class="titulo_menu"><a href="#" class="link_menu" target="alvo">Link fixo</a></div>
<div class="titulo_menu" ><a href="java script:void(escondediv('1',n_divs))" class="link_menu" >Categoria 1</a></div>
<div id="mdiv1" style="display:none">
<table border="0">
<tr><td id="um" class="itens_menu" ><a href="#" onmouseover="reveza('um')" onmouseout="volta('um')" class="link_smenu" target="alvo">link item1A</a></td></tr>
<tr><td class="itens_menu" ><a href="#" class="link_smenu" target="alvo">link item2A</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3A</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('2',n_divs))" class="link_menu">Categoria 2</a></div>
<div id="mdiv2" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item1B</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item2B</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3B</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('3',n_divs))" class="link_menu">Categoria 3</a></div>
<div id="mdiv3" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item1C</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item2C</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3C</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('4',n_divs))" class="link_menu">Categoria 4</a></div>
<div id="mdiv4" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item1D</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item2D</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu" target="alvo">link item3D</a></td></tr>
</table>
</div>
<div class="titulo_menu"><a href="java script:void(escondediv('5',n_divs))" class="link_menu">Categoria 5</a></div>
<div id="mdiv5" style="display:none">
<table border="0">
<tr><td class="itens_menu"><a href="#" class="link_smenu">link item1E</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu">link item2E</a></td></tr>
<tr><td class="itens_menu"><a href="#" class="link_smenu">link item3E</a></td></tr>
</table>
</div>
<!--||||||||||||||||| COLOQUE DENTRO AS TAGS BODY||||||||||||||||||||||||||||| -->
</body>
</html>
FICOU XIQUE NOS ÚRTIMO!
AGRADEÇO POR DEMAIS A SUA AJUDA!
QUANDO PRECISAR EU VOLTO!
BEIJOS LINDINHO!
TÉ MAIS! MIRTES
0 usuário(s) está(ão) lendo este tópico
0 membro(s), 0 visitante(s) e 0 membros anônimo(s)
