Opacidade nas categorias retráteis

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

Resolvido Opacidade nas categorias retráteis

Mensagem por iHeloaD em 22/05/14, 06:26 pm

  • Descrição:
Olá,

Como posso deixar um efeito de opacidade, quando ocultamos uma categoria em meu fórum? http://prntscr.com/3ln9p3.

Obrigado.

  • Informações:
Fórum:http://cidadesocial.forumeiros.com/Versão:PUNBB
Tipo:Pedido de códigoTags:Opacidade,categorias,retráteis



Última edição por iHeloaD em 24/05/14, 05:47 pm, editado 1 vez(es)
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Opacidade nas categorias retráteis

Mensagem por iPrompt em 22/05/14, 06:39 pm

Olá,

Você deseja colocar o sistema de + e - ?

Até
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

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

Resolvido Re: Opacidade nas categorias retráteis

Mensagem por iHeloaD em 22/05/14, 07:28 pm

Olá,

Os botões de + e - já tenho, desejo que quando algum usuário oculte alguma categoria, a mesma tenha um efeito de opacidade nela, como neste fórum www.fmservices.forumeiros.com.

Até mais.
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Opacidade nas categorias retráteis

Mensagem por Hancki em 23/05/14, 05:38 am

Olá!

Remova o código JS que tem que faz isso... adicione este:
Código:
$(function () {
    $('.main-head:has(.page-title)').prepend('<style>.main .main-head.collapsed { opacity: .2; }</style><a class="collapse tcatCollapse" id="collapse_c_cat1" href="#top" style="visibility:hidden;float: right;margin-top: -3px;"><img src="http://i.imgur.com/d7jXnmJ.png" alt=""></a>');
    $('.main-head:has(.page-title)').mouseover(function () {
        $(this).find('a.collapse[id]').css('visibility', 'visible')
    });
    $('.main-head:has(.page-title)').mouseout(function () {
        $(this).find('a.collapse[id]').css('visibility', 'hidden')
    });
    $('.main-head a.collapse[id]').click(function (e) {
        e.preventDefault()
    });
    $('.main-head a.collapse[id]').attr('onclick', " if($(this).closest('.main-head').next('.main-content:first').css('display')=='none') {my_setcookie($(this).closest('.main-head').find('.page-title').text()+'_ct','0',10,0); $(this).closest('.main-head').next('.main-content:first').slideDown(500);$(this).find('img').attr('src','http://i.imgur.com/I5HCAxH.png');$(this).closest('.main-head');$(this).closest('.main-head').removeClass('collapsed')} else {my_setcookie($(this).closest('.main-head').find('.page-title').text()+'_ct','1',10,0); $(this).closest('.main-head').next('.main-content:first').slideUp(500);$(this).find('img').attr('src','http://i.imgur.com/LBFBNlE.png'); $(this).closest('.main-head').addClass('collapsed');}");
    $(document).ready(function () {
        $('.main-head a.collapse[id]').closest('.main-head').each(function () {
            if (my_getcookie($(this).find('.page-title').text() + '_ct') == '1') {
                $(this).next('.main-content:first').css('display', 'none');
                $(this).find('a.collapse[id] img').attr('src', 'http://i.imgur.com/LBFBNlE.png');
                $(this).closest('.main-head').addClass('collapsed')
            } else {
                $(this).next('.main-content:first').css('display', 'block');
                $(this).find('a.collapse[id] img').attr('src', 'http://i.imgur.com/I5HCAxH.png');
                $(this).closest('.main-head').removeClass('collapsed')
            }
        })
    })
});
Este já faz isso tudo!

Hancki
avatar

Hancki
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8047
Pontos Ativos : 12032

Ver perfil do usuário http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://www.facebook.com/djtomoficial

Resolvido Re: Opacidade nas categorias retráteis

Mensagem por iHeloaD em 23/05/14, 11:59 am

Olá,

Ele só aparece quando passamos o mouse em cima da categoria, eu gostaria que ele foce fixo.

Obrigado.
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

Resolvido Re: Opacidade nas categorias retráteis

Mensagem por Hancki em 23/05/14, 02:19 pm

Este:
Código:
$(function () {
    $('.main-head:has(.page-title)').prepend('<style>.main .main-head.collapsede { opacity: .2; }</style><a class="collapsee tcatCollapse" id="collapse_c_cat1" href="#top" style="float: right;margin-top: -3px;"><img src="http://i.imgur.com/d7jXnmJ.png" alt=""></a>');
    $('.main-head a.collapsee[id]').click(function (e) {
        e.preventDefault()
    });
    $('.main-head a.collapsee[id]').attr('onclick', " if($(this).closest('.main-head').next('.main-content:first').css('display')=='none') {my_setcookie($(this).closest('.main-head').find('.page-title').text()+'_ct','0',10,0); $(this).closest('.main-head').next('.main-content:first').slideDown(500);$(this).find('img').attr('src','http://i.imgur.com/I5HCAxH.png');$(this).closest('.main-head');$(this).closest('.main-head').removeClass('collapsede')} else {my_setcookie($(this).closest('.main-head').find('.page-title').text()+'_ct','1',10,0); $(this).closest('.main-head').next('.main-content:first').slideUp(500);$(this).find('img').attr('src','http://i.imgur.com/LBFBNlE.png'); $(this).closest('.main-head').addClass('collapsede');}");
    $(document).ready(function () {
        $('.main-head a.collapsee[id]').closest('.main-head').each(function () {
            if (my_getcookie($(this).find('.page-title').text() + '_ct') == '1') {
                $(this).next('.main-content:first').css('display', 'none');
                $(this).find('a.collapsee[id] img').attr('src', 'http://i.imgur.com/LBFBNlE.png');
                $(this).closest('.main-head').addClass('collapsede')
            } else {
                $(this).next('.main-content:first').css('display', 'block');
                $(this).find('a.collapsee[id] img').attr('src', 'http://i.imgur.com/I5HCAxH.png');
                $(this).closest('.main-head').removeClass('collapsede')
            }
        })
    })
});
Hancki
avatar

Hancki
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8047
Pontos Ativos : 12032

Ver perfil do usuário http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://www.facebook.com/djtomoficial

Resolvido Re: Opacidade nas categorias retráteis

Mensagem por iHeloaD em 24/05/14, 05:47 pm

Perfeito, muito obrigado!

Até mais.
avatar

iHeloaD
Membro do Fórum

Masculino
Inscrito dia : 11/10/2012
Mensagens : 1700
Pontos Ativos : 2816

Ver perfil do usuário http://www.cidadesocial.com https://www.facebook.com/gustavofaq

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