Jump to content
Fórum Script Brasil
  • 0

Menu

fly

Asked by fly,

 Share

Question

10 answers to this question

Recommended Posts

  • 0
cyberalexxx

cyberalexxx

Posted
Posted

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 to comment
Share on other sites
  • 0
cyberalexxx

cyberalexxx

Posted
Posted

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 to comment
Share on other sites
  • 0
fertel

fertel

Posted
Posted

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 to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing


  • Forum Statistics

    • Total Topics
      150.8k
    • Total Posts
      648.5k
×
×
  • Create New...