Ir para conteúdo

POWERED BY:

Arquivado

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

FabioAzzo

Fazer um Menu

Por , em Javascript

Recommended Posts

FabioAzzo    0

FabioAzzo
Postado

Pessoal, ola a todos, sou novo no forum

 

Estou com uma dúvida quanto ao menu de um site que estou fazendo.

 

O objetivo do site é ser uma espécie de museu virtual, então ja criei um layout da página principal no photoshop, fatiei e salvei como web.

 

O problema é que eu pretendia que o menu ficasse fixo e visível na base da página, independente do quanto o usuário mexesse na barra de rolagem. Igual o que foi usado nesse site:

 

www.moma.org

 

Não precisava ter essa feature de clicar no mais e o painel se abrir, apenas que ficasse fixo como esse fica.

 

Dando uma olhada no código fonte percebi que deve ser feito com CSS e/ou JavaScript.

 

Como sou noob ainda nesse meio webdesignistico, tendo mais experiência com artes gráficas e produções em vídeo, precisava de ajuda sobre como fazer algo semelhante ao utilizado no site do Museu de Arte Moderna de Nova Iorque...

 

O layout que eu fiz é esse:

 

http://img18.imageshack.us/img18/379/memorian.jpg

 

Eu gostaria de fazer a mesma coisa com aquele menu em branco e vermelho. Aliás, eu sei que vou precisar mudar o estilo daquele menu, mas por enquanto to buscando em como fazer o que eu quero...

 

qualquer resposta, mesmo que seja um 'lamento, não sei' será bem vinda =P

 

 

valeu!

 

 

ps: se alguém se interessa por musica e quiser aprender gaita de boca, estou a disposição para ajudar: http://www.forum.clickgratis.com.br/rodrigobrasilei

Compartilhar este post

Link para o post
Compartilhar em outros sites

klonder    14

klonder
Postado

Pow cara... lamento, não sei...

kkkkkkkkkk

 

Brincadeira! Sei sim!

 

Olha só:

<html>
<title>Menu fixo!</title>
<style type="text/css">
html,body{
margin:0;padding:0;
overflow:hidden;
width:100%;
height:100%;
}
#fixed{
width:600px; left:50%;
margin-left:-300px;
position:absolute; z-index:2;
bottom:0px;
background-color:#EFEFEF;
}
#corpo{
width:100%;
height:100%;
overflow:auto;
}
td.menu1 {background-color:#FFFFFF; font-size:14px; font-family:tahoma; text-align:center;}
td.menu2 {background-color:#FF0000; font-size:10px; font-family:tahoma; text-align:center; color:#FFFFFF;}
a.link1 {color:#000000; font-weight:bold}
</style>
</head>
<body>
<div id="fixed">
<table width="100%">
<tr>
	<td class="menu1">
	<a href="inicio.htm" class="link1">Inicio</a> | <a href="perfil.htm" class="link1">Perfil</a> | <a href="contato.htm" class="link1">Contato</a>
	</td>
</tr>
<tr>
	<td class="menu2">
	Todos os direitos reservados.
	</td>
</tr>
</table>
</div>
<div id="corpo">
<br><br>Coloque o conteúdo do seu site dentro da div: corpo.
<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste<br><br>Teste
</div>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito