Código JS de notificações

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

Resolvido Código JS de notificações

Mensagem por Shaman em 23/03/15, 11:31 am

Detalhes da dúvida

Versão do fórum : PunBB
Nível de acesso : Fundador
Navegador usado : Opera
Imagem :
Imagem da minha dúvida:

Membros afetados : Todos os membros do fórum
Endereço do fórum : http://www.brasilplayconnect.com

Descrição do problema

Olá, gostaria de saber se alguem da equipe Staff ou algum membro que tenha experiência em JavaScript possa me ajudar a destacar os campos da imagem. Destacar no caso poderia ser assim + -: no caso nos 2 campos destacados na imagem acima.

No caso a notificação aparecia quando eu recebesse uma MP ou uma notificação.

Se alguém souber ajudar fico grato!


Última edição por LucaS Carvalho em 24/03/15, 03:38 pm, editado 1 vez(es)
avatar

Shaman
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 2448

Ver perfil do usuário http://www.nexplorer.tk https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts

Resolvido Re: Código JS de notificações

Mensagem por Hancki em 23/03/15, 12:23 pm

Olá!

Fiz um código aqui que vai resultar na perfeição! Se o número for 0 (zero), não vai aparecer o botão!
Insira este código numa página Javascript, investida em todas as páginas:
Código:
$(function() {
    $('#user_navigation.logged_in').after('<div id="countMPS" style="color:white;display:none">Carregando...</div><style>#numberMPS { background-color:#D3162A;font-size: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: center; padding-bottom: 10px; width: 15px; height: 3px; margin-left: -30px; margin-top: 5px !important;  position: absolute !important; line-height: 12px; }</style>');
    $('#countMPS').load('privmsg?folder=inbox img[src="http://i38.servimg.com/u/f38/18/39/69/76/nuevo10.png"]', function() {
        var sizeMPS = $('#countMPS img').size();
        $('#user_navigation a#inbox_link').after('<span id="numberMPS">' + sizeMPS + '</span>');
        if (sizeMPS == '0') {
            $('#numberMPS').hide();
        }
    });
});
$(function() {
    $('#user_navigation.logged_in').after('<div id="countNoti" style="color:white;display:none">Carregando...</div><style>#numberNoti { background-color:#D3162A;font-size: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: center; padding-bottom: 10px; width: 15px; height: 3px; margin-left: -30px; margin-top: 5px !important;  position: absolute !important; line-height: 12px; }</style>');
    $('#countNoti').load('profile?mode=editprofile&page_profil=notifications .hidden-if-toolbar-deactivated p.h2', function() {
        var sizeNoti = $('#countNoti').text();
        $('#user_navigation a#notify_link').after('<span id="numberNoti">' + sizeNoti + '</span>');
        // --
        $('#numberNoti').text(function() {
            return $(this).text().replace(' notificações', '');
        });
        // --
        if (sizeNoti == '0') {
            $('#numberNoti').hide();
        }
    });
});
Resultado: http://prntscr.com/6kcxeo

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: Código JS de notificações

Mensagem por Gaaratsu em 23/03/15, 12:36 pm

Tópico movido de "Outras questões" para "Questões sobre JavaScript & jQuery"


Bem-vindo(a) ao Fórum dos Fóruns Convidado!
Leia as Regras do Fórum dos Fóruns (FDF) e o Regulamento do setor de Suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Gaaratsu — Ajudeiro
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7504

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

Resolvido Re: Código JS de notificações

Mensagem por Shaman em 23/03/15, 12:40 pm

Perfeito @Hancki , apenas um problema nas notificações, quando esta 0 aparece assim: se puder resolver agradeço Muito feliz
avatar

Shaman
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 2448

Ver perfil do usuário http://www.nexplorer.tk https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts

Resolvido Re: Código JS de notificações

Mensagem por Shaman em 24/03/15, 03:20 pm

avatar

Shaman
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 2448

Ver perfil do usuário http://www.nexplorer.tk https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts
  • 0

Resolvido Re: Código JS de notificações

Mensagem por Hancki em 24/03/15, 03:32 pm

Olá de novo amigo!

Me desculpe, eu nem tinha reparado nisso! slap

Mas... já está corrigido!
Zero notificações -> Desaparece!

Apague todo o código que dei na primeira resposta e coloque este:
Código:
$(function() {
    $('#user_navigation.logged_in').after('<div id="countMPS" style="color:white;display:none">Carregando...</div><style>#numberMPS { background-color:#D3162A;font-size: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: center; padding-bottom: 10px; width: 15px; height: 3px; margin-left: -30px; margin-top: 5px !important;  position: absolute !important; line-height: 12px; }</style>');
    $('#countMPS').load('privmsg?folder=inbox img[src="http://i38.servimg.com/u/f38/18/39/69/76/nuevo10.png"]', function() {
        var sizeMPS = $('#countMPS img').size();
        $('#user_navigation a#inbox_link').after('<span id="numberMPS">' + sizeMPS + '</span>');
        if (sizeMPS == '0') {
            $('#numberMPS').hide();
        }
    });
});
$(function() {
    $('#user_navigation.logged_in').after('<div id="countNoti" style="color:white;display:none">Carregando...</div><style>#numberNoti { background-color:#D3162A;font-size: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: center; padding-bottom: 10px; width: 15px; height: 3px; margin-left: -30px; margin-top: 5px !important;  position: absolute !important; line-height: 12px; }</style>');
    $('#countNoti').load('profile?mode=editprofile&page_profil=notifications .hidden-if-toolbar-deactivated p.h2', function() {
        var sizeNoti = $('#countNoti').text();
        $('#user_navigation a#notify_link').after('<span id="numberNoti">' + sizeNoti + '</span>');
        // --
        $('#numberNoti').text(function() {
            return $(this).text().replace(' notificações', '');
        });
        // --
        if (sizeNoti == '1 notificação') {
            $('#numberNoti').text(function() {
                return $(this).text().replace(' notificação', '');
            });
        }
        if (sizeNoti == '0 notificação') {
            $('#numberNoti').hide();
        }
    });
});
Espero que agora funcione bem!

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: Código JS de notificações

Mensagem por Shaman em 24/03/15, 03:38 pm

Perfeito @Hancki obrigado!
avatar

Shaman
Membro do Fórum

Masculino
Inscrito dia : 30/01/2014
Mensagens : 1784
Pontos Ativos : 2448

Ver perfil do usuário http://www.nexplorer.tk https://www.facebook.com/pages/Nexplorer/857666487628799?fref=ts

Resolvido Re: Código JS de notificações

Mensagem por Gaaratsu em 24/03/15, 03:49 pm

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


Bem-vindo(a) ao Fórum dos Fóruns Convidado!
Leia as Regras do Fórum dos Fóruns (FDF) e o Regulamento do setor de Suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
Gaaratsu — Ajudeiro
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 6005
Pontos Ativos : 7504

Ver perfil do usuário http://narutongo.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