Ir para conteúdo

POWERED BY:

Arquivado

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

Giovanni Campigotto

Controlando Fundo da Página com CSS

Por , em Javascript

Recommended Posts

Giovanni Campigotto    0

Giovanni Campigotto
Postado

Bom dia, amigos!

 

Ando estudando muito o CSS para desenvolver as páginas da melhor forma, para todos os browsers.

 

Bem, nos últimos dias tenho tentado fazer com que uma página que estou fazendo tenha seu fundo alterado, através de links, como a cor e imagem de fundo, de acordo com o link que é clicado.

 

Mas não encontro exemplos para fazer isso e pergunto à vocês onde posso encontrar um tutorial explicando como implantar essa funcionalidade, como fazer?

 

Detalhando um pouco melhor, é assim:

 

A página tem um menu colorido, onde cada item tem uma cor. De acordo com o item que a pessoa clicar, algumas partes da página irão ficar com a cor do item. A página está em ASP.NET, utilizando Master Page.

 

Aguardo um help! :unsure:

 

Abraços.

Compartilhar este post

Link para o post
Compartilhar em outros sites

inforsis    1

inforsis
Postado

Bom Dia Giovanni Campigotto Seja Bem Vindo ao Fórum!

 

Então o que você quer você pode obter utilizando além do css JavaScript. Vamos ver se consigo te dar uma noção:

JavaScript

<script language="JavaScript" type="text/javascript">
function mudaCor(cor)
{
document.getElementById('fundo').style.background = cor;
}
</script>

HTML

<body id="fundo">
<a href='java script:mudaCor("#FF0000")'>vermelho</a>
<a href='java script:mudaCor("#FFFF00")'>amarelo</a>
<a href='java script:mudaCor("#FF00FF")'>rosa</a>
</body>

 

PS: Acho que isso te ajuda a ter uma noção, desculpa não fazer comentários sobre o script (é que não estou legal), mais se você estiver com dúvidas é só perguntar novamente.

OK?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovanni Campigotto    0

Giovanni Campigotto
Postado

Oi Inforsis.

Obrigado pela resposta, eu entendi o que você passou.

Mas na verdade eu tenho que mudar cor e imagem de fundo e um .css específico (pois utilizo vários).

Na verdade, não seria mais interessante fazer a página puxar outro css?

 

Abraços!

(melhoras!)

 

 

 

Bom Dia Giovanni Campigotto Seja Bem Vindo ao Fórum!

 

Então o que você quer você pode obter utilizando além do css JavaScript. Vamos ver se consigo te dar uma noção:

JavaScript

<script language="JavaScript" type="text/javascript">
function mudaCor(cor)
{
document.getElementById('fundo').style.background = cor;
}
</script>

HTML

<body id="fundo">
<a href='java script:mudaCor("#FF0000")'>vermelho</a>
<a href='java script:mudaCor("#FFFF00")'>amarelo</a>
<a href='java script:mudaCor("#FF00FF")'>rosa</a>
</body>

 

PS: Acho que isso te ajuda a ter uma noção, desculpa não fazer comentários sobre o script (é que não estou legal), mais se você estiver com dúvidas é só perguntar novamente.

OK?

 

Fála velho!

 

Sim, eu quero mudar algumas cores e imagens que envolvem todo o estilo.

Não tenho um exemplo da página ainda no ar, mas vou tentar providenciar!!!

 

Está em ASP.NET, utiliza Master Page para organizar e não criar várias estruturas!

 

Obrigado!!!

 

 

Bom Dia Giovanni Campigotto Seja Bem Vindo ao Fórum!

 

Então o que você quer você pode obter utilizando além do css JavaScript. Vamos ver se consigo te dar uma noção:

JavaScript

<script language="JavaScript" type="text/javascript">
function mudaCor(cor)
{
document.getElementById('fundo').style.background = cor;
}
</script>

HTML

<body id="fundo">
<a href='java script:mudaCor("#FF0000")'>vermelho</a>
<a href='java script:mudaCor("#FFFF00")'>amarelo</a>
<a href='java script:mudaCor("#FF00FF")'>rosa</a>
</body>

 

PS: Acho que isso te ajuda a ter uma noção, desculpa não fazer comentários sobre o script (é que não estou legal), mais se você estiver com dúvidas é só perguntar novamente.

OK?

 

 

Fála velho!

 

Sim, eu quero mudar algumas cores e imagens que envolvem todo o estilo.

Não tenho um exemplo da página ainda no ar, mas vou tentar providenciar!!!

 

Está em ASP.NET, utiliza Master Page para organizar e não criar várias estruturas!

 

Obrigado!!!

 

você quer mudar só a cor o estilo todo???

abraço

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovanni Campigotto    0

Giovanni Campigotto
Postado

Alguém teria mais alguma luz?

 

Abraços!

 

Oi Inforsis.

Obrigado pela resposta, eu entendi o que você passou.

Mas na verdade eu tenho que mudar cor e imagem de fundo e um .css específico (pois utilizo vários).

Na verdade, não seria mais interessante fazer a página puxar outro css?

 

Abraços!

(melhoras!)

 

 

 

Bom Dia Giovanni Campigotto Seja Bem Vindo ao Fórum!

 

Então o que você quer você pode obter utilizando além do css JavaScript. Vamos ver se consigo te dar uma noção:

JavaScript

<script language="JavaScript" type="text/javascript">
function mudaCor(cor)
{
document.getElementById('fundo').style.background = cor;
}
</script>

HTML

<body id="fundo">
<a href='java script:mudaCor("#FF0000")'>vermelho</a>
<a href='java script:mudaCor("#FFFF00")'>amarelo</a>
<a href='java script:mudaCor("#FF00FF")'>rosa</a>
</body>

 

PS: Acho que isso te ajuda a ter uma noção, desculpa não fazer comentários sobre o script (é que não estou legal), mais se você estiver com dúvidas é só perguntar novamente.

OK?

 

Fála velho!

 

Sim, eu quero mudar algumas cores e imagens que envolvem todo o estilo.

Não tenho um exemplo da página ainda no ar, mas vou tentar providenciar!!!

 

Está em ASP.NET, utiliza Master Page para organizar e não criar várias estruturas!

 

Obrigado!!!

 

 

Bom Dia Giovanni Campigotto Seja Bem Vindo ao Fórum!

 

Então o que você quer você pode obter utilizando além do css JavaScript. Vamos ver se consigo te dar uma noção:

JavaScript

<script language="JavaScript" type="text/javascript">
function mudaCor(cor)
{
document.getElementById('fundo').style.background = cor;
}
</script>

HTML

<body id="fundo">
<a href='java script:mudaCor("#FF0000")'>vermelho</a>
<a href='java script:mudaCor("#FFFF00")'>amarelo</a>
<a href='java script:mudaCor("#FF00FF")'>rosa</a>
</body>

 

PS: Acho que isso te ajuda a ter uma noção, desculpa não fazer comentários sobre o script (é que não estou legal), mais se você estiver com dúvidas é só perguntar novamente.

OK?

 

 

Fála velho!

 

Sim, eu quero mudar algumas cores e imagens que envolvem todo o estilo.

Não tenho um exemplo da página ainda no ar, mas vou tentar providenciar!!!

 

Está em ASP.NET, utiliza Master Page para organizar e não criar várias estruturas!

 

Obrigado!!!

 

você quer mudar só a cor o estilo todo???

abraço

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovanni Campigotto    0

Giovanni Campigotto
Postado

Amigos, é algo assim que quero fazer, vejam as mudanças de cores que têm: http://br.msn.com/.

 

Pois, a minha dúvida fica se devo ou não criar um css para cada botão, qual seria a melhor forma de fazer isso.

 

Abraços!

 

 

Bom dia, amigos!

 

Ando estudando muito o CSS para desenvolver as páginas da melhor forma, para todos os browsers.

 

Bem, nos últimos dias tenho tentado fazer com que uma página que estou fazendo tenha seu fundo alterado, através de links, como a cor e imagem de fundo, de acordo com o link que é clicado.

 

Mas não encontro exemplos para fazer isso e pergunto à vocês onde posso encontrar um tutorial explicando como implantar essa funcionalidade, como fazer?

 

Detalhando um pouco melhor, é assim:

 

A página tem um menu colorido, onde cada item tem uma cor. De acordo com o item que a pessoa clicar, algumas partes da página irão ficar com a cor do item. A página está em ASP.NET, utilizando Master Page.

 

Aguardo um help! :unsure:

 

Abraços.

Compartilhar este post

Link para o post
Compartilhar em outros sites

inforsis    1

inforsis
Postado

Giovanni Campigotto, Boa Tarde!

Posta um link para o pessoal observar como você esta fazendo... ;)

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovanni Campigotto    0

Giovanni Campigotto
Postado

Fála velho!

 

Na verdade, não vou conseguir subir o sistema todo, mas fiz duas imagens.

Na segunda, mostro (destacado em verm.) aonde quero mudar.

Tudo está em uma estrutura sem frames, utilizando css para o body, form. O body.css é onde está configurado tudo de cor, espaçamentos.

 

Segue os links:

 

http://www.estratege.com.br/developing/portal01.gif

http://www.estratege.com.br/developing/portal02.gif

 

Abraços man!

 

Giovanni Campigotto, Boa Tarde!

Posta um link para o pessoal observar como você esta fazendo... ;)

Compartilhar este post

Link para o post
Compartilhar em outros sites

inforsis    1

inforsis
Postado

Giovanni Campigotto, Boa Tarde!

Então, para mim as imagens não facilitaram muito para te ajudar... Pois dependia da estrutura que você tem para poder me basear...

Mais em outro momento (se estiver tempo) monto algo do tipo e testo para ver, caso consiga posto o resultado... Enquanto isso vai tentando algo e espero que alguém possa te ajudar. Posta o resultado caso consiga.

 

Até Mais.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Paulo de Tarso F. M.    24

Paulo de Tarso F. M.
Postado

Mas afinal, meu caro Giovanni Campigotto, você quer que o usuário possa escolher a cor das páginas, como no msn.com, ou você quer que cada página tenha uma cor e uma imagem de fundo diferente? :mellow:

 

Porque eu imaginei que era trocar as cores na mesma página, mas com estas imagens, me parece que não é bem isso... Ou é? Enfim, explique um pouco mais a situação...

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovanni Campigotto    0

Giovanni Campigotto
Postado

Inforsis,

 

Na verdade, é que nem o site do msn que quero fazer.

Eu não vou conseguir subir ainda para a web pois há umas configurações do ASP.NET que precisa ser feita no servidor.

Mas é algo praticamente igual ao do msn.com.br.

Tô correndo atrás, assim que descobrir, jogarei tudo aqui!

 

Valeu!

 

Fála velho!

 

Na verdade, não vou conseguir subir o sistema todo, mas fiz duas imagens.

Na segunda, mostro (destacado em verm.) aonde quero mudar.

Tudo está em uma estrutura sem frames, utilizando css para o body, form. O body.css é onde está configurado tudo de cor, espaçamentos.

 

Segue os links:

 

http://www.estratege.com.br/developing/portal01.gif

http://www.estratege.com.br/developing/portal02.gif

 

Abraços man!

 

Giovanni Campigotto, Boa Tarde!

Posta um link para o pessoal observar como você esta fazendo... ;)

 

Oi Paulo!

 

Então, na verdade, a idéia é idêntica a do msn.com mas, as cores vão mudar de acordo com o que você clicar no menu. Repare, pelas imagens, que o menu é todo colorido, cada item tem uma cor.

E como a estrutura da página está com uma Master Page no ASP.NET, gostaria de auxílio para a melhor forma de fazer isso, se uso um @import css, essas coisas.

Eu gostaria de aprender como o msn fez para poder implantar isso do meu jeito.

 

Abraços!

 

Giovanni Campigotto, Boa Tarde!

Então, para mim as imagens não facilitaram muito para te ajudar... Pois dependia da estrutura que você tem para poder me basear...

Mais em outro momento (se estiver tempo) monto algo do tipo e testo para ver, caso consiga posto o resultado... Enquanto isso vai tentando algo e espero que alguém possa te ajudar. Posta o resultado caso consiga.

 

Até Mais.

 

Oi Paulo!

 

Então, na verdade, a idéia é idêntica a do msn.com mas, as cores vão mudar de acordo com o que você clicar no menu. Repare, pelas imagens, que o menu é todo colorido, cada item tem uma cor.

E como a estrutura da página está com uma Master Page no ASP.NET, gostaria de auxílio para a melhor forma de fazer isso, se uso um @import css, essas coisas.

Eu gostaria de aprender como o msn fez para poder implantar isso do meu jeito.

 

Abraços!

 

Mas afinal, meu caro Giovanni Campigotto, você quer que o usuário possa escolher a cor das páginas, como no msn.com, ou você quer que cada página tenha uma cor e uma imagem de fundo diferente? :mellow:

 

Porque eu imaginei que era trocar as cores na mesma página, mas com estas imagens, me parece que não é bem isso... Ou é? Enfim, explique um pouco mais a situação...

Compartilhar este post

Link para o post
Compartilhar em outros sites

brcontainer    16

brcontainer
Postado

bem acredito que seja isso que você queira:

<script language="JavaScript" type="text/javascript">
function mudaCor(cor,image)
{
document.getElementById('fundo').style.background = cor;
document.getElementById('fundo').style.backgroundImage = "url("+image+");";
}
</script>

<body id="fundo">
<a href='java script:mudaCor("#FF0000","a.png")'>vermelho</a>
<a href='java script:mudaCor("#FFFF00","b.png")'>amarelo</a>
</body>

sua duvida não é bem CSS é mais javascript

irei mover o tópico, pois lá podem lhe ajudar acaso não seja essa a solução

 

abraço ;)

 

movido de Webstandards: CSS / XML / XHTML/ HTML http://forum.imasters.com.br/public/style_emoticons/default/seta.gif javascript/dhtml

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