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

Menu


fly

Pergunta

10 respostass a esta questão

Posts Recomendados

  • 0

Menu é muito subjetivo!!!!

Que tipo de menu voce quer???

Geralmente se ve mais nos foruns o pessoal procurando por menus pop-up e drop-down, ai tem sem que ser em Javascript com CSS e exige um bom conhecimento para desenvolver.

Visite o link abaixo que tem alguns geradores de menus interessantes

http://www.milonic.com

Link para o comentário
Compartilhar em outros sites

  • 0

eu peguei um modelo de menu do site da MILONIC, mas o menu precisa de uma licença para utiliza-lo.

Realmente precisa de licença.

Tentou usar o CoffeeCup Free DHTML Menu Builder, que é gratuito??

Ou faça uma busca na seção de Javascript que voce deve encontrar alguma coisa.

tenho esse exemplo aki que usei em um dos meus primeiros trabalhos, é facil de adaptar:

<html>
<head>
<body STYLE="background-color:#FFFFFF" bgcolor="#FFFFFF" >
<body bgcolor="#FFFFFF">
<STYLE type=text/css>
.mh {
PADDING-RIGHT: 5px; DISPLAY: block; PADDING-LEFT: 4px; FONT-WEIGHT: bold; FONT-SIZE: 9px; PADDING-BOTTOM: 2px;; WIDTH: expression("100%"); COLOR: #3058A8; PADDING-TOP: 1px; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #70DB93}
.mn {
BORDER-RIGHT: #556677 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #556677 1px solid; PADDING-LEFT: 1px; Z-INDEX: 100; BACKGROUND: #70DB93; PADDING-BOTTOM: 1px; BORDER-LEFT: #556677 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #556677 1px solid; POSITION: absolute
}
.mn A {
BORDER-RIGHT: #eeeff0 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eeeff0 1px solid; DISPLAY: block; PADDING-LEFT: 4px; FONT-WEIGHT: normal; FONT-SIZE: 9px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ffffff 1px solid;; WIDTH: expression("100%"); COLOR: #ffffff; PADDING-TOP: 1px; BORDER-BOTTOM: #eeeff0 1px solid; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none
}
.mn A:hover {
BORDER-RIGHT: #223344 1px inset; BORDER-TOP: #223344 1px inset; BACKGROUND: #ffffff; BORDER-LEFT: #223344 1px inset; COLOR: #3058A8; BORDER-BOTTOM: #223344 1px inset; TEXT-DECORATION: none
}
.sp {
BORDER-TOP: #ffffff 0px solid; MARGIN: 2px; BORDER-BOTTOM: #334455 1px solid
}

<STYLE type=text/css>
.mh {
PADDING-RIGHT: 5px; DISPLAY: block; PADDING-LEFT: 4px; FONT-WEIGHT: bold; FONT-SIZE: 9px; PADDING-BOTTOM: 2px;; WIDTH: expression("100%"); COLOR: #3058A8; PADDING-TOP: 1px; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #238E23}
.mn {
BORDER-RIGHT: #556677 1px solid; PADDING-RIGHT: 1px; BORDER-TOP: #556677 1px solid; PADDING-LEFT: 1px; Z-INDEX: 100; BACKGROUND: #238E23; PADDING-BOTTOM: 1px; BORDER-LEFT: #556677 1px solid; PADDING-TOP: 1px; BORDER-BOTTOM: #556677 1px solid; POSITION: absolute
}
.mn A {
BORDER-RIGHT: #eeeff0 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #eeeff0 1px solid; DISPLAY: block; PADDING-LEFT: 4px; FONT-WEIGHT: normal; FONT-SIZE: 9px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ffffff 1px solid;; WIDTH: expression("100%"); COLOR: #ffffff; PADDING-TOP: 1px; BORDER-BOTTOM: #eeeff0 1px solid; FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif; TEXT-DECORATION: none
}
.mn A:hover {
BORDER-RIGHT: #223344 1px inset; BORDER-TOP: #223344 1px inset; BACKGROUND: #ffffff; BORDER-LEFT: #223344 1px inset; COLOR: #3058A8; BORDER-BOTTOM: #223344 1px inset; TEXT-DECORATION: none
}
.sp {
BORDER-TOP: #ffffff 0px solid; MARGIN: 2px; BORDER-BOTTOM: #334455 1px solid
}
</STYLE>
</head>
<base target="_top">

<div style="position:absolute;z-index:9">
<script language="Javascript">
q1="<a href='";
q2="' title='";
q3="'>";
q4="</a>";
q5="<div class=sp></div>";
q6="</div>";
q7="<div class='mh'>";
q8="' class='mn' style='position: absolute;width:"
d=document;
dm=d.getElementById?1:0;
ie=d.all?1:0;
i4=(d.all && !dm)?1:0;
n4=d.layers?1:0
mn=new Array();
ln=new Array();
sn=new Array();
sw=new Array();
el= new Array();
mel= new Array()
tp=1 // distância do topo do menu em relação a página 
lf=0 //distância da esquerda do menu em relação a página
sp=27 //espaço entre os menus
hr=1 //espaço horizontal (1 - horizontal | 0 - vertical)
oh=50 
ov=50
// Menu Primeiro Botao
mn[0]='Home';ln[0]='sementes.asp?tipo=home';sw[0]=105;sn[0]="" //primeiro titulo
+q1+"sementes.asp?tipo=home"+q2+"Pagina principal"+q3+"Pagina principal"+q4
//Menu Segundo Botao
mn[1]='Empresa';ln[1]='sementes.asp?tipo=home';sw[1]=95;sn[1]=""
+q1+"sementes.asp?tipo=empresa"+q2+"Nossa empresa"+q3+"Quem Somos"+q4
+q1+"sementes.asp?tipo=atuacao"+q2+"mercado"+q3+"Atuação"+q4
+q1+"sementes.asp?tipo=contato"+q2+"entre em contato conosco"+q3+"Contato"+q4
//Menu Terceiro Botao
mn[2]='Nossos Produtos';ln[2]='sementes.asp';sw[2]=105;sn[2]=""
+q7+"Sementes"+q6
+q1+"sementes.asp?tipo=fo"+q2+"Sementes Forrageiras"+q3+"Forrageiras"+q4
+q1+"sementes.asp?tipo=le"+q2+"Sementes Leguminosas"+q3+"Leguminosas"+q4
+q7+"Informações Uteis"+q6
+q1+"sementes.asp?tipo=tabela&tb=f"+q2+"Detalhes das sementes forrageiras"+q3+"Tabela de Forrageiras"+q4
//Menu Quarto Botao
mn[3]='Dicas de Plantio';ln[3]='sementes.asp?tipo=dicas';sw[3]=105;sn[3]=""
+q1+"sementes.asp?tipo=dicas"+q2+"Informações para um bom plantio"+q3+"Dicas de Plantio"+q4
//Menu Quinto Botao
mn[4]='links';ln[4]='sementes.asp?tipo=links';sw[4]=105;sn[4]=""
+q1+"sementes.asp?tipo=links"+q2+"Links interessantes"+q3+"Links interessantes"+q4
ma=mn.length;mw=0;for(i=0;i<ma;i++){if(sw[i]>mw)mw=sw[i]}d.write("<div id='ctrl' style='position:absolute;width:100%;height:100%;z-index:90' onmouseover='há()'></div>");ctr=gE('ctrl')
if(hr==1){sp+=(dm&&!ie)?4:0;for(i=0;i<ma;i++){d.write("<div id='main"+i+q8+sw[i]+";top:"+tp+";left:"+lf+q3+q1+ln[i]+"' onmouseover='há();sE(el["+i+"]);sE(ctr)"+q3+mn[i]+q4+q6);mel[i]=gE("main"+i);d.write("<div id='sub"+i+q8+sw[i]+";top:"+(tp+gH(mel[i])-1)+";left:"+lf+q3+sn[i]+q6);el[i]=gE("sub"+i);lf+=(gW(mel[i])+sp)}}
else{for(i=0;i<ma;i++){d.write("<div id='main"+i+q8+mw+";top:"+tp+";left:"+lf+q3+q1+ln[i]+"' onmouseover='há();sE(el["+i+"]);sE(ctr)"+q3+mn[i]+q4+q6);mel[i]=gE("main"+i);d.write("<div id='sub"+i+q8+sw[i]+";top:"+(tp+ov)+";left:"+(lf+mw-oh)+q3+sn[i]+q6);tp+=(gH(mel[i])+sp);el[i]=gE("sub"+i)}}
function há(){for(i=0;i<ma;i++)hE(el[i]);hE(ctr)};function zA(){for(i=0;i<ma;i++){sZ(el[i],111);sZ(mel[i],100)}};function gE(e){if(dm){r=d.getElementById(e);return d.getElementById(e).style}if(i4)return d.all[e].style;if(n4)return d.layers[e]}
function hE(e){e.visibility="hidden"};function sE(e){e.visibility="visible"};function sZ(e,z){e.zIndex=z};function gH(e){h=parseInt(e.height||e.pixelHeight||r.offsetHeight);return h};function gW(e){w=parseInt(e.width||e.pixelWidth||r.offsetWidth);return w}
há();zA();d.onclick=há
</script>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p>
</body>
</div>
</html>

Link para o comentário
Compartilhar em outros sites

  • 0

Existe um componente em ASP que cria os menus dinâmicamente.

Nos servidores da Locaweb tem, mas como é componente depende de que o servidor o tenha.

Caso você não hospede nesta empresa, as idéias acima são excelentes.

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,3k
    • Posts
      652,3k
×
×
  • Criar Novo...