Ir para conteúdo

POWERED BY:

Arquivado

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

Buthy

Cabeçalho do site fixo

Por , em Javascript

Recommended Posts

Buthy    0

Buthy
Postado

Dae galera, estou precisando deixar o cabeçalho de um site fixo, pois o mesmo tem um player de música, e não queria que a cada clique numa seção do site, a música começasse a tocar denovo :S

 

Não gostaria de usar frames, por causa da barra de rolagem...

Vi que da pra fazer com include ou java script, mas não sei muito, e não consegui achar algo bom no google...

 

Fico no aguardo de uma ajudinha ai :D

 

Obrigado

Até mais

Compartilhar este post

Link para o post
Compartilhar em outros sites

alcaidedigital    57

alcaidedigital
Postado

O problema do include é que cada vez que voce clicar em um link ele irá carregar seu player novamente... logo se o seu usuario estiver ouvindo uma musica vai ficar toda hora interrompendo....

 

minha solução é

 

crie duas divs principais.

<body>
<div id="player">
<!--Seu player aqui dentro-->
</div>
<div id="content">
<!--Site aqui dentro-->
</div>
</body>

Baixe o jQuery e inclua no seu site http://jquery.com/

Adicione esse script dentro do seu head

<script language="javascript" type="text/javascript">
function openPage(url){
$('#content').load(url);
}
</script>

 

Agora todos links seus deverá ser

<a href="javascript:openPage('suaPaginaAqui.html');">Link</a>

 

Documentação do Load do jQuery: http://api.jquery.com/load/

 

 

PS: na teoria funciona... B)

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

@senartes, dica de melhoria:

 

-> esqueça o atributo language, não tem mais pq usar ele hoje em dia

-> use jQuery para não misturar as camadas, fazer uma function, e chamar de forma inline, vai contra os principios da biblioteca

<script type="text/javascript">
$(document).ready(function(){
  $('a').click(function( e ){
      e.preventDefault();
      openPage( $( this ).attr('href') );
  });
});
function openPage(url){
       $('#content').load(url);
}
</script>

E entao, teus links ficariam:

<a href="suaPaginaAqui.html">Link</a>

um tanto melhor, sob diversos pontos

Além de que, se desativar o suporte (ou não tiver), a javascript, o site continua acessível.

 

 

@topic, eu pessoalmente não carregaria conteudo com ajax.

você terá muitas dores de cabeça por causa disso.

 

Veja que grandes rádios, apenas abrem um popup e pronto. O rádio fica lá tocando no popup, e o cara pode atá sair do teu site, e continuar ouvindo, se assim quiser.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Buthy    0

Buthy
Postado

Muito obrigado senarets e William Bruno

 

Era bem isso que eu queria!

 

:joia:

 

Só uma coisinha...

 

Daí no html eu preciso deixar somente:

 

<div id="content">
...
...
... conteúdo
...
</div>

 

Só que dai na parte do conteúdo não carrega o CSS e nem aparece os acentos...

Tentei deixar o <head></head> e também não deu certo...

 

Alguém sabe o que fazer?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Só que dai na parte do conteúdo não carrega o CSS e nem aparece os acentos...

Começaram os 'problemas' que mencionei.

 

Outro ponto que vai notar, cedo ou tarde, é que qq script que você trouxer com ajax, não irá funcionar.

o AJAX do jQuery, é por padrão UTF8, ou seja, você tá inserindo uma string em UTF no documento.. como está o resto ? ISO ?

 

se tiver, tente padronizar, ou 'converter'...

Qnto ao css, não sei lhe dizer, está meio estranho.. poste um link para o teu site.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Buthy    0

Buthy
Postado

É, realmente começou um monte de problemas ehehe

 

Começando pelo menu, no menu do topo tem um efeito css que muda a imagem do menu que está selecionado...

Por exemplo o BIOGRAFIA...

 

To tentando ajeitar, mas tá uma confusão aqui! ashuiashuiahs

 

O link (provisório) pro site é esse:

 

http://www.mudancasdaniela.com.br/eduardoegustavo/

 

Valeu cara

Abraço

 

PS: outra coisa que ficou ruim com essa função dos links, é que todo link utiliza ela, até do slider e tal...

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Não entendi o problema do menu.

 

se o seletor tá muito guloso, limite ele:

 

$('.menu_nav a').click(function( e ){

assim a função será disparada somente, nos links do menu.

os outros seguirão o seu comportamento sem interferência desse js.

 

Aguarda cara, eu não respondi, pq não tive tempo.

Mas existe toda uma comunidade aqui do fórum que pode te ajudar, se souberem. Enqnto isso, vá vendo outras áreas de compartilhando conhecimento. Afinal não tem sentido um fórum, onde as pessoas só 'perguntam', e 'não respondem', os outros.

 

Vou mover para javascript, okay ? visto que não há mais nenhuma relação com php na tua dúvida.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Buthy    0

Buthy
Postado

como funciona essa função? é só por do jeito que você disse, ficando assim:

 

<script type="text/javascript">
$(document).ready(function(){
  $('a').click(function( e ){
      e.preventDefault();
      openPage( $( this ).attr('href') );
  });
});
function openPage(url){
       $('#conteudo').load(url);
       $('.menu_nav a').click(function( e ){
}
</script>

 

isso? Dai me parece que da erro no "{' do final.. eu não entendo mta coisa de JS :S

 

Quanto ao menu, eu queria deixar só a logo do site, e o player fixos.. pois o menu tem uma <div class="active"> que deixa o botão selecionado quando você está nele.

 

E foi mal pela MP, é que estou meio apurado, e achei que você tinha esquecido do tópico! ehehe

E pode mover pra JavaScript :D

 

Valeu cara

 

Até

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

era para trocar:

 

<script type="text/javascript">
$(document).ready(function(){
  $('.menu_nav a').click(function( e ){
      e.preventDefault();
      openPage( $( this ).attr('href') );
  });
});
function openPage(url){
       $('#conteudo').load(url);
}
</script>

acredita em mim, deixa o menu fixo também, pois se você fizer da forma que você está pensando, terá outros problemas..

de atrelar eventos a elementos que não existiam no DOM.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Buthy    0

Buthy
Postado

Ok, entendi...

 

Dai não tem como fazer esse efeito que eu queria? de deixar o botão selecionado quando está na página...

 

Tipo.. não sei se você viu o site ( http://www.mudancasdaniela.com.br/eduardoegustavo ), mas quando clico no menu (Biografia), os CSS não são carregados, e a página inicial fica repetida logo abaixo da biografia... :S

 

Estou tentando de várias formas aqui, mas não estou conseguindo :(

 

Desse jeito que o site está, ele ainda está somente com a logo e o player fixos, o menu não está, para eu conseguir o resultado do efeito...

 

Queria tentar resolver esses outros problemas, sem tirar esse efeito, mas se não der, eu tiro o efeito mesmo, eheh

 

Muito obrigado!

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