Background conforme hora do dia

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

Resolvido Background conforme hora do dia

Mensagem por Connor R. em 06/08/13, 07:47 pm

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

http://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, 08:50 am, editado 1 vez(es)
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Resolvido Re: Background conforme hora do dia

Mensagem por MateusA em 06/08/13, 07:54 pm

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.
avatar

MateusA
Hiperativo

Masculino
Inscrito dia : 13/05/2013
Mensagens : 3225
Pontos Ativos : 4215

Ver perfil do usuário https://www.facebook.com/forumeirospt https://twitter.com/forumeiros_pt

Resolvido Re: Background conforme hora do dia

Mensagem por Connor R. em 06/08/13, 07:55 pm

Não resultou meu caro.........
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara
  • 0

Resolvido Re: Background conforme hora do dia

Mensagem por Sennior em 06/08/13, 08:53 pm

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.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Background conforme hora do dia

Mensagem por MateusA em 06/08/13, 09:08 pm

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.
avatar

MateusA
Hiperativo

Masculino
Inscrito dia : 13/05/2013
Mensagens : 3225
Pontos Ativos : 4215

Ver perfil do usuário https://www.facebook.com/forumeirospt https://twitter.com/forumeiros_pt

Resolvido Re: Background conforme hora do dia

Mensagem por Connor R. em 07/08/13, 08:46 am

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...
avatar

Connor R.
Usuário destaque

Masculino
Inscrito dia : 06/08/2012
Mensagens : 978
Pontos Ativos : 1594

Ver perfil do usuário http://somosmugiwara.forumeiros.com https://www.facebook.com/kadandajr https://twitter.com/SomosMugiwara

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum