[Resolvido] Player de música fixo sem frames

[Criamix 0]

Pessoal, é o seguinte: um cliente quer um player de músicas no site dele. É uma empresa de comida japonesa, e ele quer dar um ar moderno ao site. Porém, preciso que este player fique fixo na página, sem ser recarregado cada vez que o usuário mudar de página.

 

Antigamente eu metia um iframe bem no meio da página para publicar o conteúdo e este problema estava resolvido, mas como hoje em dia utilizo os padrões de desenvolvimento webstandard, não estou encontrando a solução adequada. Alguma div, um javascript, algo assim, não sei! Vou continuar pesquisando, mas se alguém tiver alguma sugestão, agradeço muito!

 

Obrigado desde já!

[Henrique Barcelos 290]

Bom, você pode fazer a navegação toda em AJAX, mas não recomendo...

 

Estava com o msm problema que você então decidi que a radio abriria em uma janela separada e tocaria, assim você não precisaria carregar tudo com AJAX...

[Criamix 0]

É, eu cheguei a pensar em carregar o site todo via Ajax, mas não acho bacana. E abrir uma pop-up para a música também acho ruim. Gostaria de encontrar alguma solução diferente, tipo uma camada fixa, não sei ainda. Mas obrigado pela dica! Continuarei pesquisando e, se encontrar algo, posto aqui também.

 

Até mais!

 

OBS: continuo aceitando sugestões! Onde estão todos???

[Buthy 0]

Estou com essa mesma dúvida :S

[William Bruno 1501]

É, eu cheguei a pensar em carregar o site todo via Ajax, mas não acho bacana. E abrir uma pop-up para a música também acho ruim.

so conheço além destas 2 opções, o uso de <iframe> (que também é ruim).

 

no caso, veja que 'para conseguir a camada fixa', as técnicas que existem são essas 3.

Não vejo pra onde fugir.

[Criamix 0]

Pois é... acabei optando pelo uso do Javascript mesmo. A paginação é feita utilizando o recurso innerHTML.

 

Foi uma experiência interessante, gerou muitos desafios (tivemos que desenvolver todos os formulários em Ajax para evitar o reload da página), mas não indico para qualquer projeto .

 

Já o player foi feito em Flash mesmo e ficou fixo. Somente o conteúdo é alterado através do script.

 

Funciona desta forma:

 

scripts.js

function GetXMLHttp() { 
if(navigator.appName == "Microsoft Internet Explorer") { 
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } 
else { 
xmlHttp = new XMLHttpRequest(); 
} 
return xmlHttp;
}
var xmlRequest = GetXMLHttp();

function abrirPag(valor){

var url = valor;
xmlRequest.open("GET",url,true);
xmlRequest.onreadystatechange = mudancaEstado;
xmlRequest.send(null); 
return url;
}

function mudancaEstado(){
if (xmlRequest.readyState == 4){
document.getElementById("conteudo").innerHTML = xmlRequest.responseText;
}
}

 

Para chamar as páginas é simples:

 

<a href="javascript:abrirPag('empresa.html');">A Empresa</a>

<a href="javascript:abrirPag('servicos.html');">Serviços</a>

<a href="javascript:abrirPag('servicos.html');">Produtos</a>

 

 

OBS: vale lembrar que deve existir uma DIV identificada como "conteudo" onde as páginas chamadas sejam publicadas na tela (EX: <div id="conteudo"></div>)

 

Se quiserem acessar o site, está no www.ri-po-pi.com.br (depois da infame introdução!)

 

Abraços!

[William Bruno 1501]

bacana @Criamix, como sugestao de 'melhoria', veja esse meu post:

 

http://forum.imasters.com.br/topic/403171-pagina-dentro-de-div-ajax-problema-ao-atualizar/page__view__findpost__p__1581230

 

a vantagem é a alteração da URL, e dependendo de como você implementar, tem como fazer o site funcionar sem javascript também.

[Criamix 0]

bacana @Criamix, como sugestao de 'melhoria', veja esse meu post:

 

http://forum.imaster...ost__p__1581230

 

a vantagem é a alteração da URL, e dependendo de como você implementar, tem como fazer o site funcionar sem javascript também.

 

Legal William! Vou estudar o seu script e testá-lo. O legal é aprender! E já gravei o seu blog no meu favoritos! Bem bacana!

 

[]s!

 

 

 

[Najar Santos 0]

Pessoal, é o seguinte: um cliente quer um player de músicas no site dele. É uma empresa de comida japonesa, e ele quer dar um ar moderno ao site. Porém, preciso que este player fique fixo na página, sem ser recarregado cada vez que o usuário mudar de página.

 

Antigamente eu metia um iframe bem no meio da página para publicar o conteúdo e este problema estava resolvido, mas como hoje em dia utilizo os padrões de desenvolvimento webstandard, não estou encontrando a solução adequada. Alguma div, um javascript, algo assim, não sei! Vou continuar pesquisando, mas se alguém tiver alguma sugestão, agradeço muito!

 

Obrigado desde já!

 

 

Sei que ai diz [Resolvido] mas não custa postar.

Eu quebrei muito a cabeça tentando conseguir colocar um player de minha web-rádio fixo no topo.

Resolvi com um .php

 

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<title>ZION VOICES web-rádio</title>

</head>

 

<frameset rows="45,*" frameborder="NO" border="0" framespacing="0">

<frame src="http://alacalifornia.com/radio/index.htm" name="PlayerRox" frameborder="no" scrolling="no" noresize marginwidth="0" marginheight="0" id="PlayerRox">

<frame src="http://alacaliforniaweb.blogspot.com/" name="mainFrame" frameborder="no" marginwidth="0" marginheight="0">

 

</html>

</frameset>

<noframes><body>

</body></noframes>

 

Coloquei isso na index de meu domínio ( alacalifornia.com ) e deu certo. No meu caso eu não tenho um site ainda, então coloquei a rádio no domínio e o blog abre na mainFrame. Dá certo!

Modifique as partes em vermelho do script para os seus endereços e não esqueça de colocar para abrir suas páginas internas, todas na mainFrame.

Espero que te ajude.

</html>