Variar imagem de fundo de acordo com os fóruns

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

Resolvido Variar imagem de fundo de acordo com os fóruns

Mensagem por Br_SP_Rodrigo em 18/05/17, 09:40 pm

Detalhes da questão


Endereço do fórum: http://www.novaerarpg.com
Versão do fórum: Invision

Descrição


A imagem de fundo do meu fórum é esta abaixo:



A página principal do meu fórum, portanto, está assim:



O que eu quero é o seguinte: quando alguém abrir o primeiro fórum que tá aparecendo na imagem, chamado Dark and Deep Storyteller, a imagem de fundo será trocada por outra. Queria saber se é possível fazer isso com todos os fóruns do meu site, alterando as imagens de fundo de acordo com cada fórum e sub-fórum.

Grato desde já.


Última edição por Br_SP_Rodrigo em 23/05/17, 08:46 am, editado 1 vez(es)
avatar

Br_SP_Rodrigo
Nível 8

Masculino
Inscrito dia : 14/06/2012
Mensagens : 135
Pontos Ativos : 199

Ver perfil do usuário http://nefr.forumeiros.com/

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Kyo Panda em 19/05/17, 01:57 pm

Adicione a um novo Javascript com investimento em todas as páginas:

Código:
(function($) {
   'use strict';
   
   if (!/^\/f\d+-.*/i.test(location.pathname)) {
      return;
   }
   
   var config = {
      backgrounds: {
         1: 'https://i37.servimg.com/u/f37/17/02/65/26/fundo_11.jpg',
         3: 'https://image.freepik.com/psd-gratis/projeto-abstrato-do-fundo_1297-82.jpg',
      },
   };
   
   var background = config.backgrounds[~~location.pathname.replace(/^\/f(\d+)-.*/i, '$1')];
   
   if (!background) {
      return;
   }
   
   $('<style>', { html: [
      'body {',
      '  background-image: url(' + background + ');',
      '}',
   ].join('\n') })
      .appendTo('head')
   ;
}(jQuery));

Nessa parte o senhor pode configurar os backgrounds:

Código:
   var config = {
      backgrounds: {
         1: 'https://i37.servimg.com/u/f37/17/02/65/26/fundo_11.jpg',
         3: 'https://image.freepik.com/psd-gratis/projeto-abstrato-do-fundo_1297-82.jpg',
      },
   };

Sempre com ID_DO_FÓRUM: 'http://endereco.da/imagem.png'.

o/
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Br_SP_Rodrigo em 19/05/17, 04:39 pm

Olá Kyo Panda,

Funcionou em partes. Eu queria que o background mudasse também para todos os sub-links que viessem abaixo dos IDs que eu colocar. Por exemplo,

Fórum 1
- Sub-fórum 1
- Sub-fórum 2

Eu queria que, ao mudar o background do Fórum 1, mudasse automaticamente para todos os seus sub-fóruns, tópicos, etc. Tem como fazer isso?
avatar

Br_SP_Rodrigo
Nível 8

Masculino
Inscrito dia : 14/06/2012
Mensagens : 135
Pontos Ativos : 199

Ver perfil do usuário http://nefr.forumeiros.com/

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Br_SP_Rodrigo em 20/05/17, 05:28 pm

up
avatar

Br_SP_Rodrigo
Nível 8

Masculino
Inscrito dia : 14/06/2012
Mensagens : 135
Pontos Ativos : 199

Ver perfil do usuário http://nefr.forumeiros.com/

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Br_SP_Rodrigo em 21/05/17, 08:52 pm

up
avatar

Br_SP_Rodrigo
Nível 8

Masculino
Inscrito dia : 14/06/2012
Mensagens : 135
Pontos Ativos : 199

Ver perfil do usuário http://nefr.forumeiros.com/

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Kyo Panda em 22/05/17, 09:12 am

Troque por esse:

Código:
(function($) {
   'use strict';
   
   var config = {
      backgrounds: {
         1: 'https://i37.servimg.com/u/f37/17/02/65/26/fundo_11.jpg',
         3: 'https://image.freepik.com/psd-gratis/projeto-abstrato-do-fundo_1297-82.jpg',
      },
   };
   
   var href = $('#navstrip a[href^="/f"]:last').attr('href');
   
   if (!href) {
      return;
   }
   
   var background = config.backgrounds[~~href.replace(/^\/f(\d+)-.*/i, '$1')];
   
   if (!background) {
      return;
   }
   
   $('<style>', { html: [
      'body {',
      '  background-image: url(' + background + ');',
      '}',
   ].join('\n') })
      .appendTo('head')
   ;
}(jQuery));
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Br_SP_Rodrigo em 22/05/17, 03:47 pm

@Kyo Panda escreveu:Troque por esse:

Código:
(function($) {
   'use strict';
   
   var config = {
      backgrounds: {
         1: 'https://i37.servimg.com/u/f37/17/02/65/26/fundo_11.jpg',
         3: 'https://image.freepik.com/psd-gratis/projeto-abstrato-do-fundo_1297-82.jpg',
      },
   };
   
   var href = $('#navstrip a[href^="/f"]:last').attr('href');
   
   if (!href) {
      return;
   }
   
   var background = config.backgrounds[~~href.replace(/^\/f(\d+)-.*/i, '$1')];
   
   if (!background) {
      return;
   }
   
   $('<style>', { html: [
      'body {',
      '  background-image: url(' + background + ');',
      '}',
   ].join('\n') })
      .appendTo('head')
   ;
}(jQuery));

Esse código não funcionou nada, Kyo.
avatar

Br_SP_Rodrigo
Nível 8

Masculino
Inscrito dia : 14/06/2012
Mensagens : 135
Pontos Ativos : 199

Ver perfil do usuário http://nefr.forumeiros.com/
  • 0

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Kyo Panda em 23/05/17, 08:17 am

Como assim nada? Não fale assim do código. Ele tem sentimentos!

Spoiler:
Mostrando a lingua

---

Peço perdão, faltou uma peça:

Código:
(function($) {
   'use strict';
   
   var config = {
      backgrounds: {
         1: 'https://i37.servimg.com/u/f37/17/02/65/26/fundo_11.jpg',
         3: 'https://image.freepik.com/psd-gratis/projeto-abstrato-do-fundo_1297-82.jpg',
      },
   };
   
   $(function() {
      var href = $('#navstrip a[href^="/f"]:last').attr('href');
   
      if (!href) {
         return;
      }
      
      var background = config.backgrounds[~~href.replace(/^\/f(\d+)-.*/i, '$1')];
      
      if (!background) {
         return;
      }
      
      $('<style>')
         .text([
              'body {'
            , '    background-image: url(' + background + ');'
            , '}'
         ].join('\n'))
         .appendTo('head')
      ;
   });
}(jQuery));
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Br_SP_Rodrigo em 23/05/17, 08:44 am

@Kyo Panda escreveu:Como assim nada? Não fale assim do código. Ele tem sentimentos!

Spoiler:
Mostrando a lingua

---

Peço perdão, faltou uma peça:

Código:
(function($) {
   'use strict';
   
   var config = {
      backgrounds: {
         1: 'https://i37.servimg.com/u/f37/17/02/65/26/fundo_11.jpg',
         3: 'https://image.freepik.com/psd-gratis/projeto-abstrato-do-fundo_1297-82.jpg',
      },
   };
   
   $(function() {
      var href = $('#navstrip a[href^="/f"]:last').attr('href');
   
      if (!href) {
         return;
      }
      
      var background = config.backgrounds[~~href.replace(/^\/f(\d+)-.*/i, '$1')];
      
      if (!background) {
         return;
      }
      
      $('<style>')
         .text([
              'body {'
            , '    background-image: url(' + background + ');'
            , '}'
         ].join('\n'))
         .appendTo('head')
      ;
   });
}(jQuery));

Hahahah. Agora sim deu certo. Valeu Kyo!

Abraços.
avatar

Br_SP_Rodrigo
Nível 8

Masculino
Inscrito dia : 14/06/2012
Mensagens : 135
Pontos Ativos : 199

Ver perfil do usuário http://nefr.forumeiros.com/

Resolvido Re: Variar imagem de fundo de acordo com os fóruns

Mensagem por Kyo Panda em 23/05/17, 08:46 am

o/

---
Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
avatar

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4638
Pontos Ativos : 5914

Ver perfil do usuário http://ajuda.forumeiros.com

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