Sistema de Abas (Tópicos)

2 participantes

Ir para baixo

Tópico resolvido Sistema de Abas (Tópicos)

Mensagem por ZombieW 08.12.19 18:36

Detalhes da questão


Endereço do fórum: https://tutorialdoca.forumeiros.com
Versão do fórum: phpBB3

Descrição


Boa tarde,

Eu montei um JS+CSS para fazer um "sistema de abas", onde já passei para a Staff adicionar nos guias.

Portanto, eu comecei usando esse sistema nos tópicos e posteriormente coloquei também nas páginas HTML.

Porém, de um tempo para cá, somente está funcionando nas páginas HTML, gostaria de uma ajuda para entender isso.

Exemplo de Página HTML com o Sistema de Abas funcional: https://tutorialdoca.forumeiros.com/h17-equipamentos-ausentes-no-br

Exemplo de Tópico com o Sistema de Abas não funcional: https://tutorialdoca.forumeiros.com/t2053-familia-acr#2355

O trecho usado em cada tipo é o mesmo:

Código:
<div class="container">
<ul class="tabs">
<li class="tab-link current" data-tab="tab-1">ABA 1</li>
<li class="tab-link" data-tab="tab-2">ABA 2</li>
<li class="tab-link" data-tab="tab-3">ABA 3</li>
</ul>

<div id="tab-1" class="tab-content current">
ABA 1
</div>
<div id="tab-2" class="tab-content">
ABA 2
</div>
<div id="tab-3" class="tab-content">
ABA 3
</div>
</div><!-- container -->

Sistema de Abas (CSS)

Código:
/* Sistema de Abas - Início */
.container{
    /*width: 95%;*/
    width: auto!important;
    margin: 0 auto;
    text-align: center;
}
.subcontainer{
    /*width: 95%;*/
    width: auto!important;
    margin: 0 auto;
    text-align: center;
}
ul.tabs{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
ul.tabs li{
    background: #171717;
    color: #C1FA17;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
   font-weight: bold;
    font-style: italic;
}
ul.tabs li.current{
    background: #C1FA17;
    color: #000000;
    font-style: normal;
}
.tab-content{
    display: none;
    background: #171717;
    color: #FFFFFF;
    padding: 15px;
    border-style: solid;
    border-width: 5px;
    border-color: #C1FA17;
}
.tab-content.current{
    display: inherit;
}
ul.tabs br, ul.tabs + br, ul.tabs + br + br, .tab-content + br {display:none!important}
/* Sistema de Abas - Fim */

Sistema de Abas (JS)

Código:
$(document).ready(function(){
   
   $('ul.tabs li').click(function(){
      var tab_id = $(this).attr('data-tab');

      $('ul.tabs li').removeClass('current');
      $('.tab-content').removeClass('current');

      $(this).addClass('current');
      $("#"+tab_id).addClass('current');
   })
})


Última edição por ZombieW em 08.12.19 18:39, editado 1 vez(es)
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por Convidado 08.12.19 18:38

Olá,

Desative um JS um por um até encontrar o problema.

Cordialmente,
Roger123
Anonymous
Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por ZombieW 08.12.19 18:42

Não ativei ou desativei nenhum JS recentemente.

Não há outra forma de ver o motivo do não funcionamento? Já que em uma parte do site funciona e outra não, dificilmente deverá ser algum JS.
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por Convidado 08.12.19 18:44

Os JS podem estar em conflito com esse JS. Recomendo que faça o que lhe pedi para saber de onde vem o problema.
Anonymous
Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por ZombieW 08.12.19 22:18

Achei dois:

Onde o primeiro, acredito que parou de funcionar, devido ao tópico de redirecionamento não existir mais.

Remoção do Ícone de Cadeado

Código:
$(function(){
$('a[href^="https://i.servimg.com/u/f82/17/53/75/18/cadead10.gif"]').addClass('dl.icon').attr('href', '/t1380-').css('display', 'none');
});

Porém, o segundo não faz sentido...

Copyright

Código:
jQuery(document).ready(function() {
msg = '<center><strong><p style="color:#c1fa17;font-size:12px">© 2012 - 2019 Tutorial do CA - Todos os direitos reservados</p></strong></center>';
jQuery('#page-footer').html(jQuery('#page-footer').html() + msg);
});
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por tikky 08.12.19 22:36

Olá @ZombieW,

O primeiro script não compreendi se o senhor queria que fosse refeito ou irá remover o mesmo, porém o segundo altere para esta atualização:
Código:
(function($) {
 
    $(function() {
 
        var msg = [
            '<center>',
            ' <strong>',
            '  <p style="color:#c1fa17;font-size:12px">',
            '    © 2012 - 2019 Tutorial do CA - Todos os direitos reservados',
            '  </p>',
            ' </strong>',
            '</center>'
        ].join('\n');
 
        $('#page-footer').html(msg);
    });
})(jQuery);


Atenciosamente,
pedxz.
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por ZombieW 08.12.19 22:56

Olá Pedxz!

O segundo script eu deixei desativado, no momento, não tenho necessidade dele.

Porém, o primeiro era para remover esse ícone de cadeado, pois, vive torto:

Sistema de Abas (Tópicos) Captur13


Última edição por ZombieW em 08.12.19 23:09, editado 1 vez(es)
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por tikky 08.12.19 22:59

Se for somente para remover o ícone adicione na sua folha de estilo o seguinte código:
Código:
img[src="https://i.servimg.com/u/f82/17/53/75/18/cadead10.gif"] { display: none; }

Se não funcionar irei precisar de uma conta teste se possível, porque não sei se é uma imagem ou um background Mostrando a lingua
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por ZombieW 08.12.19 23:18

Não resolveu.

Criei um usuário de teste para você, passo as informações via privado?
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por tikky 09.12.19 6:47

ZombieW escreveu:Não resolveu.

Criei um usuário de teste para você, passo as informações via privado?
Sim, por favor Rosa
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por ZombieW 09.12.19 16:57

Enviado, aguardando retorno.
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por tikky 09.12.19 18:35

Altere o código para:
Código:
dd.dterm[style="background-image: url(https://i.servimg.com/u/f82/17/53/75/18/cadead10.gif);"] {
  background-image: url(https://2img.net/i/fa/empty.gif)!important;
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por ZombieW 09.12.19 21:40

Pedxz escreveu:Altere o código para:
Código:
dd.dterm[style="background-image: url(https://i.servimg.com/u/f82/17/53/75/18/cadead10.gif);"] {
  background-image: url(https://2img.net/i/fa/empty.gif)!important;

Colocado na folha de estilo, mas o erro permanece.

Local que pode ser visto o erro: https://tutorialdoca.forumeiros.com/f30-guias-diversos (no anuncio global)
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por tikky 09.12.19 22:12

Altere para:
Código:
dd.dterm[style*="https://i.servimg.com/u/f82/17/53/75/18/cadead10.gif"] {
  background-image: url(https://2img.net/i/fa/empty.gif)!important;
}
Porém se o senhor quer remover definitivamente o ícone basta remover pelo Painel de controle > Visualização > Imagens e Cores > Gestão das imagens > Modo Avançado e vá ao separador Ícones de mensagens Muito feliz
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por ZombieW 09.12.19 22:25

Pedxz escreveu:Altere para:
Código:
dd.dterm[style*="https://i.servimg.com/u/f82/17/53/75/18/cadead10.gif"] {
  background-image: url(https://2img.net/i/fa/empty.gif)!important;
}
Porém se o senhor quer remover definitivamente o ícone basta remover pelo Painel de controle > Visualização > Imagens e Cores > Gestão das imagens > Modo Avançado e vá ao separador Ícones de mensagens Muito feliz

Agora resolveu!

Muito obrigado. Em breve irei abrir mais tópicos...rs

Sobre o acesso que te dei, precisava ser com essas permissões, para você ver aonde o ícone era exibido, pois, estava oculto a área.
ZombieW
ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Sistema de Abas (Tópicos)

Mensagem por tikky 09.12.19 22:31

Ficarei do aguardo OK

Questão resolvida

Esta questão foi dada como resolvida pelo seu autor, e por esse motivo será marcada como resolvida e movida para o arquivo de questões resolvidas desta área.
tikky
tikky
Admineiro
Admineiro

Membro desde : 13/01/2017
Mensagens : 7962
Pontos : 9217

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

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