Colocar cor no fundo do Icone

3 participantes

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

Tópico resolvido Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 0:29

Detalhes da questão


Endereço do fórum: http://policia-militar-sf.forumeiros.com/forum
Versão do fórum: phpBB3

Descrição


olá gostaria de saber como colocar uma cor no fundo quando o icone é selecionado como na imagem abaixo

http://prntscr.com/hb0zcv

obrigado!


Última edição por ranzatti em 16.11.17 19:29, editado 1 vez(es)
ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Membro Entusiasta
  • 0

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Konai 16.11.17 4:36

Olá novamente!

Aqui está o que o senhor precisa:
https://ajuda.forumeiros.com/t110696-mudar-background-do-topico-de-acordo-com-o-icone#780063

Leia com atenção. Caso não consiga entender muito bem, basta dizer que tentarei explicar melhor! Positivo

Por fim deixo-lhe o link da FAQ sobre os ícones de mensagens, veja:
https://ajuda.forumeiros.com/t8479-faq-adicionar-icones-de-mensagens

Basicamente você cria um ícone de mensagem, com nome e imagem, e edita no código conforme está no seu fórum, entende?!

Att! Feliz
Konai

Konai
Membro Entusiasta
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 14:21

Gaaratsu escreveu:Olá novamente!

Aqui está o que o senhor precisa:
https://ajuda.forumeiros.com/t110696-mudar-background-do-topico-de-acordo-com-o-icone#780063

Leia com atenção. Caso não consiga entender muito bem, basta dizer que tentarei explicar melhor! Positivo

Por fim deixo-lhe o link da FAQ sobre os ícones de mensagens, veja:
https://ajuda.forumeiros.com/t8479-faq-adicionar-icones-de-mensagens

Basicamente você cria um ícone de mensagem, com nome e imagem, e edita no código conforme está no seu fórum, entende?!

Att! Feliz

então eu não entendi aonde eu coloco o segundo codigo ?
ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Konai 16.11.17 16:10

Olá novamente!

O segundo código ele está explicando que é possível configurá-lo naquela parte(sendo que ele pegou do código completo, o primeiro código), o terceiro é se o senhor quiser adicionar mais.
Compreende?

Att! Feliz

Konai

Konai
Membro Entusiasta
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 16:43

tipo eu não estou conseguindo colocar a cor em cada icone poderia me ajudar ?
ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Konai 16.11.17 16:49

Claro!

Me passe o código que o senhor está editando e as cores que deseja. O background no caso deste código está em rgba, por isso fica assim: rgba(136, 187, 85, 0.3)
Talvez seja por este motivo que o senhor não esteja conseguindo, estou certo?!

Contente
Konai

Konai
Membro Entusiasta
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 17:07

tipo se eu passar os links dos icones + cor vc poderia fazer o codigo ?

Ícone 1: https://i.imgur.com/VlBWuVo.png | Cor: Verde
Ícone 2: https://i.imgur.com/ic87Khd.png | Cor: Vermelho
Ícone 3: https://i.imgur.com/FKMMEN2.png | Cor: Verde
Ícone 4: https://i.imgur.com/IavionT.png | Cor: #8C668C
Ícone 5: http://icons.iconarchive.com/icons/custom-icon-design/mini/32/Alert-icon.png | Cor: #D966D9
ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Konai 16.11.17 17:39

Aqui está:
Código:
(function ($) {
  'use strict';
 
  var config = [
    { url: 'https://i.imgur.com/VlBWuVo.png', background: 'rgba(0, 100, 0, 1.0)' },
    { url: 'https://i.imgur.com/ic87Khd.png', background: 'rgba(255, 0, 0, 1.0)' },
    { url: 'https://i.imgur.com/FKMMEN2.png', background: 'rgba(0, 128, 0, 1.0)' },
    { url: 'https://i.imgur.com/IavionT.png', background: 'rgba(140, 102, 140, 1.0)' },
    { url: ' http://icons.iconarchive.com/icons/custom-icon-design/mini/32/Alert-icon.png', background: 'rgba(217, 102, 217, 1.0)' }
  ];
 
  $(function () {
    $('.dterm').each(function () {
      var $this = $(this);
 
      $.each(config, function (index, icon) {
        var regex = new RegExp (icon.url, 'gi');
        if (!regex.test($this.css('background-image'))) {
          return;
        }
 
        $this
          .parent('.icon')
            .css('background-color', icon.background)
          .end()
            .parent('.row')
              .css('background-color', '#fff')
        ;
      });
    });
  });
}(jQuery));

Att! Feliz
Konai

Konai
Membro Entusiasta
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 17:44

Ficou legal vc poderia apenas alterar a cor pra mim tipo o vermelho e verde poderia por no tom da minha imagem ?

http://prntscr.com/hb0zcv

ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Konai 16.11.17 18:06

ranzatti escreveu:Ficou legal vc poderia apenas alterar a cor pra mim tipo o vermelho e verde poderia por no tom da minha imagem ?

http://prntscr.com/hb0zcv


O senhor quer igual a imagem(ícone) ou igual a cor de fundo como na imagem indicada? Pensativo
Konai

Konai
Membro Entusiasta
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 18:11

Cor!
ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Konai 16.11.17 18:16

Substitua por este:
Código:
(function ($) {
  'use strict';
 
  var config = [
    { url: 'https://i.imgur.com/VlBWuVo.png', background: 'rgba(0, 100, 0, 1.0)' },
    { url: 'https://i.imgur.com/ic87Khd.png', background: 'rgba(255, 38, 38, 0.3)' },
    { url: 'https://i.imgur.com/FKMMEN2.png', background: 'rgba(0, 166, 81, 0.3)' },
    { url: 'https://i.imgur.com/IavionT.png', background: 'rgba(140, 102, 140, 1.0)' },
    { url: ' http://icons.iconarchive.com/icons/custom-icon-design/mini/32/Alert-icon.png', background: 'rgba(217, 102, 217, 1.0)' }
  ];
 
  $(function () {
    $('.dterm').each(function () {
      var $this = $(this);
 
      $.each(config, function (index, icon) {
        var regex = new RegExp (icon.url, 'gi');
        if (!regex.test($this.css('background-image'))) {
          return;
        }
 
        $this
          .parent('.icon')
            .css('background-color', icon.background)
          .end()
            .parent('.row')
              .css('background-color', '#fff')
        ;
      });
    });
  });
}(jQuery));

Att! Feliz
Konai

Konai
Membro Entusiasta
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 18:33

alterei mais não surgiu efeito!
ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Membro Entusiasta

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Konai 16.11.17 18:35

ranzatti escreveu:alterei mais não surgiu efeito!
Certifique-se que substituiu o código, pois fiz a alteração como desejado. Deixei a mesma cor de fundo para o tópico que tiver esses ícones como na imagem indicada.
Por isso lhe perguntei se o senhor queria o fundo da mesma cor que dos ícones ou igual da imagem mostrada.
Konai

Konai
Membro Entusiasta
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por ranzatti 16.11.17 19:28

Gaaratsu escreveu:
ranzatti escreveu:alterei mais não surgiu efeito!
Certifique-se que substituiu o código, pois fiz a alteração como desejado. Deixei a mesma cor de fundo para o tópico que tiver esses ícones como na imagem indicada.
Por isso lhe perguntei se o senhor queria o fundo da mesma cor que dos ícones ou igual da imagem mostrada.

ja resolvi aqui o erro muito obrigado novamente Gaaratsu ja apliquei o ++
ranzatti

ranzatti
*****

Membro desde : 02/09/2010
Mensagens : 470
Pontos : 673

http://brnewgeneration.forumeiros.com/forum

Ir para o topo Ir para baixo

Tópico resolvido Re: Colocar cor no fundo do Icone

Mensagem por Ketholy 16.11.17 19:30

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

Ketholy
Super Membro

Membro desde : 20/01/2017
Mensagens : 1309
Pontos : 1577

http://jogosrpg-com-br.forumais.com/forum https://twitter.com/Ketholy Suan

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