Background conforme hora do dia

3 participantes

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Background conforme hora do dia

Mensagem por Connor R. 06.08.13 23:47

Qual é minha questão:
Bem estou seguindo o seguinte tutorial:

https://ajuda.forumeiros.com/t71069-tutorial-background-conforme-hora-do-dia

Bem o tutorial deu certo, mais o fundo fica em Scroll, gostaria que o mesmo ficasse fixo, tem como?

Código que estou utilizando:

Código:

jQuery(function() {
       
       //ZONA EDITABLE------------------------------------------------------------
       
       var selector_css = "body";
       var imagen_se_repite = true;   
       
       var horario_inicio = new Array();
       horario_inicio["mañana"] = 5;   
       horario_inicio["tarde"] = 12;
       horario_inicio["noche"]= 21;      
       
       var imagenes = new Array();
       imagenes["mañana"] = "http://i46.servimg.com/u/f46/11/96/49/61/body-b15.png";
       imagenes["tarde"] = "http://pieceproject.xpg.uol.com.br/wp-content/themes/pieceproject/images/background/bg-dark-1.jpg";
       imagenes["noche"] = "http://i46.servimg.com/u/f46/11/96/49/61/body-b15.png";
       //FIN ZONA EDITABLE----------------------------------------------------------
       
       
       var horaActual = (new Date()).getHours();
       var imagen = "";
       if(horaActual >= horario_inicio["mañana"] && horaActual < horario_inicio["tarde"]){
          imagen = imagenes["mañana"];
       }else if(horaActual >= horario_inicio["tarde"] && horaActual < horario_inicio["noche"]){
          imagen = imagenes["tarde"];
       }else if(horaActual >= horario_inicio["noche"] || horaActual < horario_inicio["mañana"]){
          imagen = imagenes["noche"];
       }
       
       if(imagen_se_repite){
          jQuery(selector_css).css("background", "url(" + imagen + ") repeat");
       }else{
          jQuery(selector_css).css({"background-image":"url(" + imagen + ")", "background-repeat":"no-repeat", "background-size":"cover"}); 
       }
});


Endereço do meu fórum:
http://somosmugiwara.forumeiros.com

Versão do fórum:
PUNBB


Última edição por Connor R. em 07.08.13 12:50, editado 1 vez(es)
Connor R.

Connor R.
Super Membro

Membro desde : 06/08/2012
Mensagens : 1253
Pontos : 2021

http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Ir para o topo Ir para baixo

Tópico resolvido Re: Background conforme hora do dia

Mensagem por MateusA 06.08.13 23:54

Olá!

Aceda á "Folha de Estilos CSS":
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de Estilos CSS
Adicione o seguinte código no inicio da sua "Folha de Estilos CSS"

Código:
body {
background-position: fixed !important;
}

Valide e veja o resultado.
Tive uma idéia!
Atenciosamente,
Crazy.
MateusA

MateusA
Hiper Membro

Membro desde : 13/05/2013
Mensagens : 3225
Pontos : 4215

https://www.facebook.com/forumeirospt https://twitter.com/forumeiros_pt

Ir para o topo Ir para baixo

Tópico resolvido Re: Background conforme hora do dia

Mensagem por Connor R. 06.08.13 23:55

Não resultou meu caro.........
Connor R.

Connor R.
Super Membro

Membro desde : 06/08/2012
Mensagens : 1253
Pontos : 2021

http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Ir para o topo Ir para baixo

Principal Contribuidor
  • 0

Tópico resolvido Re: Background conforme hora do dia

Mensagem por Sennior 07.08.13 0:53

Olá amigo,

Altere o código pelo abaixo:

Código:
jQuery(function() {
     
      //ZONA EDITABLE------------------------------------------------------------
     
      var selector_css = "body";
      var imagen_se_repite = true; 
     
      var horario_inicio = new Array();
      horario_inicio["mañana"] = 5; 
      horario_inicio["tarde"] = 12;
      horario_inicio["noche"]= 21;     
     
      var imagenes = new Array();
      imagenes["mañana"] = "http://i46.servimg.com/u/f46/11/96/49/61/body-b15.png";
      imagenes["tarde"] = "http://pieceproject.xpg.uol.com.br/wp-content/themes/pieceproject/images/background/bg-dark-1.jpg";
      imagenes["noche"] = "http://i46.servimg.com/u/f46/11/96/49/61/body-b15.png";
      //FIN ZONA EDITABLE----------------------------------------------------------
     
     
      var horaActual = (new Date()).getHours();
      var imagen = "";
      if(horaActual >= horario_inicio["mañana"] && horaActual < horario_inicio["tarde"]){
          imagen = imagenes["mañana"];
      }else if(horaActual >= horario_inicio["tarde"] && horaActual < horario_inicio["noche"]){
          imagen = imagenes["tarde"];
      }else if(horaActual >= horario_inicio["noche"] || horaActual < horario_inicio["mañana"]){
          imagen = imagenes["noche"];
      }
     
      if(imagen_se_repite){
          jQuery(selector_css).css("background", "url(" + imagen + ") repeat");
      }else{
          jQuery(selector_css).css({"background-image":"url(" + imagen + ")", "background-repeat":"no-repeat", "background-size":"cover"});
      }
     else{
          jQuery(selector_css).css({"background-position":"fixed"});
      }
});

Até mais.
Sennior

Sennior
Principal Contribuidor
Principal Contribuidor

Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903

https://ajuda.forumeiros.com/forum https://www.facebook.com/GladstonHenriq https://twitter.com/UmGladston

Ir para o topo Ir para baixo

Tópico resolvido Re: Background conforme hora do dia

Mensagem por MateusA 07.08.13 1:08

Olá!

Troque o código por este:
Código:
        jQuery(function() {
             
              //ZONA EDITABLE------------------------------------------------------------
             
              var selector_css = "body";
              var imagen_se_repite = true; 
             
              var horario_inicio = new Array();
              horario_inicio["mañana"] = 5; 
              horario_inicio["tarde"] = 12;
              horario_inicio["noche"]= 21;     
             
              var imagenes = new Array();
              imagenes["mañana"] = "http://i46.servimg.com/u/f46/11/96/49/61/body-b15.png";
              imagenes["tarde"] = "http://pieceproject.xpg.uol.com.br/wp-content/themes/pieceproject/images/background/bg-dark-1.jpg";
              imagenes["noche"] = "http://i46.servimg.com/u/f46/11/96/49/61/body-b15.png";
              //FIN ZONA EDITABLE----------------------------------------------------------
             
             
              var horaActual = (new Date()).getHours();
              var imagen = "";
              if(horaActual >= horario_inicio["mañana"] && horaActual < horario_inicio["tarde"]){
                  imagen = imagenes["mañana"];
              }else if(horaActual >= horario_inicio["tarde"] && horaActual < horario_inicio["noche"]){
                  imagen = imagenes["tarde"];
              }else if(horaActual >= horario_inicio["noche"] || horaActual < horario_inicio["mañana"]){
                  imagen = imagenes["noche"];
              }
             
              if(imagen_se_repite){
                  jQuery(selector_css).css("background", "url(" + imagen + ") repeat");
              }else{
                  jQuery(selector_css).css({"background-image":"url(" + imagen + ")", "background-repeat":"no-repeat", "background-size":"cover", "background-position":"fixed"});
              }
        });

Até mais.
MateusA

MateusA
Hiper Membro

Membro desde : 13/05/2013
Mensagens : 3225
Pontos : 4215

https://www.facebook.com/forumeirospt https://twitter.com/forumeiros_pt

Ir para o topo Ir para baixo

Tópico resolvido Re: Background conforme hora do dia

Mensagem por Connor R. 07.08.13 12:46

Ambos não resultaram...

O do Sheldon nem sequer fez a imagem aparecer ao fundo, já o seu Crazy, ainda continuou o fundo com scroll...

Editado:

Já consegui resolver, valeu a ambos pela ajuda...
Connor R.

Connor R.
Super Membro

Membro desde : 06/08/2012
Mensagens : 1253
Pontos : 2021

http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos