Carregamento aleatório de cores e favicon

[Edmilson Cruz]

Olá pessoal!

Seguinte, utilizo um script para carregamento aleatório das cores de fundo da página como esse a seguir:

<script>
texto=new Array();
texto[0]="black";
texto[1]="white";
texto[2]="navy";
texto[3]="yellow";
x=Math.random()*3;
x=Math.round(x);
document.bgColor=texto[x];
</script>

Gostaria de saber se existe uma maneira de carregar também um Favicon específico junto com cada cor de fundo. É possível?

Obrigado.

[Jonathan Queiroz]

Talvez seja possível, não tenho certeza. Tente dar um id ao elemento link que está encarregado de mostrar o favicon e mudar seu elemento href

[Edmilson Cruz]

Sei mais ou menos o que está falando, porém não sei por onde começar :huh:

Agradeço os esclarecimentos.

[Jonathan Queiroz]

No head algo assim:

<link rel="..." [...] id="elemento"/>

E no JS:

elemento = document.getElementById("elemento")
elemento.setAttribute("nome_atributo","valor_atrivuto")

[Edmilson Cruz]

Supondo que eu retire o HREF do <link rel.... /> e inclua no mesmo uma ID="icone", por acaso não tem como fazer com condições no Javacript, tipo IF e ELSE? Ou seja, agregar ao mesmo script que mostrei no início essas condições para que se a cor resultante de fundo for o "black", o favicon carregado também será o de cor preta.

Pensei que isso pudesse ser uma solução, mas não tenho idéia de como implementar para fazer o teste.

Obrigado.

[Jonathan Queiroz]

Não entendi. pode explicar melhor ?

Essa condição seria baseada em quê ?

[Edmilson Cruz]

Como o carregamento de cores de fundo da página é aleatório, o objetivo era que quando a cor carregada da página fosse o vermelho, o favicon carregado também seria o vermelho. Pensando nisso imaginei que funcionaria adicionando no mesmo script que faz o cálculo das cores algumas linhas que ditariam condições do tipo:

- Se a cor for o azul, o favicon será o azul;

- Se a cor for o verde, o favicon também será o verde;

- E assim por diante...

Então daí é que vem o tal do IF e ELSE. Numa montagem simplificada:

if (cor de fundo azul)

{

favicon azul;

}

else if (cor de fundo verde)

{

favicon verde;

}

else

{

favicon preto;

}

Mas acho que isso não dá certo, pois são condições que dependem de pré-requisitos, ou seja, outra só é cumprida se a anterior for executada. E o correto seria que qualquer uma pudesse acontecer também aleatoriamente.

Aí está o galho. Mas não estou conseguindo quebrar. Já pesquisei por tudo quanto é lugar, vi até carregamento aleatório de Favicons através de PHP, mas esse não iria corresponder paralelamente às cores de fundo. E também não funcionou aqui.

Enfim, estamos aí. Se não tiver jeito, ficarei com o básico mesmo. <_<

[Matheus Matos]

bem, você pode utilizar o switch, ele serve exatamente para o seu caso, trabalha por casos, igual você falou, tipo:

- Se a cor for o azul, o favicon será o azul;

- Se a cor for o verde, o favicon também será o verde;

- E assim por diante...

beleza, sua estrutura é a seguinte:

switch (fundo) {

case blue:

favicon tem que ser azul

break

case green:

favicon tem que ser verde

break

case black:

favicon tem que ser preto

break

}

pode saber mais aqui: http://www.criarweb.com/artigos/220.php

hm.. beleza, só que antes, você precisa escolher a cor de fundo... bem, você prefere que seja sorteada ou uma sequencia?

Editado Novembro 6, 2009 por Matheus Matos

[SK15]

Até onde eu saiba .... favicon só carrega em tempo de execução ou seja quando a página extiver completa, mesmo você trocando o caminho dele com JS não irá trocar o favicon na tela da pessoa ... você deve usar uma linguagem dinamica como PHP (já citado) ... e PHP da para trocar as cores é só saber mesclar CSS com a páginas ...

<?php
$combinacao = rand(0, 1);

if ($combinacao == 0) {
 $favicon = "favicon_azul.ico";
 $css = "blue";
} else if ($combinacao == 1) {
 $favicon = "favicon_vermelho.ico";
 $css = "red";
}

?>

<link rel="shortcut icon" id="favicon" href="<?= $favicon ?>" />
<style>.cor { background-color: <?=$css ?>; }</style>

<div class="cor">Texto Qualquer ...</div>

[Edmilson Cruz]

bem, você pode utilizar o switch, ele serve exatamente para o seu caso, trabalha por casos, igual você falou, tipo:

- Se a cor for o azul, o favicon será o azul;

- Se a cor for o verde, o favicon também será o verde;

- E assim por diante...

beleza, sua estrutura é a seguinte:

switch (fundo) {

case blue:

favicon tem que ser azul

break

case green:

favicon tem que ser verde

break

case black:

favicon tem que ser preto

break

}

pode saber mais aqui: http://www.criarweb.com/artigos/220.php

hm.. beleza, só que antes, você precisa escolher a cor de fundo... bem, você prefere que seja sorteada ou uma sequencia?

Bem, acho que seria melhor que a cor fosse sorteada, assim eu acho que não correria o risco do fundo ser o mesmo ao acessar na página. Corrija-me se eu estiver errado. Mas como funcionaria o Swtich encaixando diretamente no meu caso?

[Edmilson Cruz]

Até onde eu saiba .... favicon só carrega em tempo de execução ou seja quando a página extiver completa, mesmo você trocando o caminho dele com JS não irá trocar o favicon na tela da pessoa ... você deve usar uma linguagem dinamica como PHP (já citado) ... e PHP da para trocar as cores é só saber mesclar CSS com a páginas ...

<?php
$combinacao = rand(0, 1);

if ($combinacao == 0) {
 $favicon = "favicon_azul.ico";
 $css = "blue";
} else if ($combinacao == 1) {
 $favicon = "favicon_vermelho.ico";
 $css = "red";
}

?>

<link rel="shortcut icon" id="favicon" href="<?= $favicon ?>" />
<style>.cor { background-color: <?=$css ?>; }</style>

<div class="cor">Texto Qualquer ...</div>

Uso o IIS 5.1 do Windows XP para testar o funcionamento de minhas páginas antes de publicá-las. Instalei há pouco tempo o PHP 5.2.1 no servidor e está rodando tranquilamente. Quando vi a sua resposta, imediamente imaginei que era a solução. Pois bem, inseri o código dentro da tag <body> do HTML e editei somente o caminho para "diretório/favicon.ico". Coloquei no <head> o <link rel... /> e o <style>...</style>.

Só não entendi a presença de uma <div>. E já que eu preciso aplicar o código ao fundo eu coloquei a classe "cor" assim: <body class="cor>

Mas não deu certo. O fundo ficou branco e o Favicon não apareceu. Alguma coisa na minha adaptação está errada? Ou será que é o PHP que não está funcionando como deveria? Aliás, é preciso ter alguma extensão para PHP específica para o código?