Ir para o conteúdo
  • Revista PROGRAMAR: Já está disponível a edição #60 da revista programar. Faz já o download aqui!

green angel

Menu "flutuante"

Mensagens Recomendadas

green angel

Boas

Para um projecto escolar criei um site que tem um menu e esse menu acompanha a barra do scroll. Fiz isso com CSS.

position:fixed;

Agora deparei-me com um problema. Por acaso ao ver um site num netbook, como o ecrã tem umas dimensões mais reduzidas, não se conseguia ver o menu todo.

Por isso queria desenvolver um script em javascript para que o menu ficasse encostado à parte superior do browser quando o banner não está à vista.

img1s.jpg

Como mostro na imagem eu queria que o menu da esquerda ficasse encostado à linha vermelha quando não se vê o banner. Se o banner estiver à vista o menu não sairia da mesma posição.

Agradeço que me dêem umas dicas,

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
green angel

O mais simples é usar posicionamento absoluto em CSS e calcular as dimensões do ecrã para que quando exista scroll ou alteração das dimensões do ecrã, o menu se mova.

Pois. Eu há uns tempos estive a explorar trabalhar com as dimensões do ecrã e encontrei alguns problemas visto que cada browser tem diferentes maneiras de "chamar" as dimensões do ecrã certo ?

Como é que eu posso fazer a distinção entre os browsers através de Javascript ?

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
mjamado

Por acaso não tens conhecimento de algum tutorial simples para iniciantes ?

No próprio site do jQuery tem guias e links para tutoriais.


"Para desenhar um website, não tenho que saber distinguir server-side de client-side" - um membro do fórum que se auto-intitula webdesigner. Temo pelo futuro da web.

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!

Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.

Entrar Agora

×

Aviso Sobre Cookies

Ao usar este site você aceita os nossos Termos de Uso e Política de Privacidade. Este site usa cookies para disponibilizar funcionalidades personalizadas. Para mais informações visite esta página.