Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications

Message par Mat Mar 14 Aoû 2018 - 23:03

Bonjour Clin d'oeil,
Je voudrais adapter ce tuto du forum portugais à la version ModernBB :
https://ajuda.forumeiros.com/t99196-tutorial-notificacoes-ao-estilo-do-facebook
Car pour l'instant il ajoute des croix supplémentaires et fonctionne une fois sur deux Visage réfléchissant

Merci d'avance Visage souriant


Dernière édition par Mat le Mer 15 Aoû 2018 - 11:30, édité 1 fois
Mat

Mat
Membre habitué

Masculin
Messages : 1356
Inscrit(e) le : 05/09/2015

Voir le profil de l'utilisateur http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications

Message par Chacha Mer 15 Aoû 2018 - 9:59

Bonjour,

Il me semble que le plus simple serait de demander de l'aide sur le FDF portugais Wink

Cordialement.
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 65190
Inscrit(e) le : 21/08/2010

Voir le profil de l'utilisateur https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications

Message par Mat Mer 15 Aoû 2018 - 11:30

Plus simple je ne sais pas, ça va être difficile en français Sueur froide
Et vu comment Google traduction me traduit le portugais Visage souriant
Mat

Mat
Membre habitué

Masculin
Messages : 1356
Inscrit(e) le : 05/09/2015

Voir le profil de l'utilisateur http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications

Message par Chacha Mer 15 Aoû 2018 - 11:47

Il n'y a plus qu'à espérer qu'un membre connaissant le portugais veuille bien se pencher sur la demande Wink

Cordialement.
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 65190
Inscrit(e) le : 21/08/2010

Voir le profil de l'utilisateur https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications

Message par Walt Mer 15 Aoû 2018 - 13:58

Bonjour,

Je ne réutilise pas tout à fait le même script car il charge autant de profil qu'il y a de notifications de membres différents. Donc si vous avez 10 notifications de 10 membres différents, chaque page du forum va charger 10 profils, même si vous n'ouvrez pas le menu des notifications.

Je préfère donc utiliser les avatars générés automatiquement, qui sont certes affichés avec un contour et de manière inclinée, mais qui ont le mérite de ne faire aucune requête supplémentaire.

Le résultat que j'obtiens :

Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications XUltvBG

Voici le script que j'utilise :
Code:
$(window).load(function() {
    $('#notif_list').show().css('opacity', '0');

    function loko() {
        $('#fa_toolbar > #fa_right > #notif_list li .contentText').each(function(notifFace) {
            var notifFaceurl = $(this).find('a[href*="/u"]').attr('href');
            $(this).prepend('<span class="notifFaceavatar" id="notifFaceavatar' + notifFace + '"></span>');
            $('#notifFaceavatar' + notifFace).html('<img src="'+ notifFaceurl +'.jpg" alt="" />');
        });

    };
    setTimeout(function() {
        loko();
        $('#notif_list').hide().css('opacity', '1');
    }, 1000);
    $('#fa_notifications').click(function() {
        $('#notif_list').css('opacity', '1').toggle();
    });
});

Et le CSS modifié :

Code:
#fa_toolbar #fa_right #notif_list:-webkit-scrollbar-track {
   -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3) !important;
   border-radius:10px !important;
   background-color:#F5F5F5 !important;
}
#fa_toolbar #fa_right #notif_list:-webkit-scrollbar {
   width:12px !important;
   background-color:#F5F5F5 !important;
}
#fa_toolbar #fa_right #notif_list:-webkit-scrollbar-thumb {
   border-radius:10px !important;
   -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3) !important;
   background-color:#555 !important;
}
#fa_toolbar #fa_right #notif_list {
   overflow:hidden;
   height:400px !important;
   overflow-x:hidden !important;
}
#fa_toolbar #fa_right #notif_list:hover {
   overflow:scroll !important;
   overflow-x:hidden !important;
}
#fa_toolbar #fa_right #notif_list li.unread {
   background-color:#EEEFF4 !important;
}
#fa_toolbar #fa_right #notif_list li .contentText {
   color:#333 !important;
   height:50px !important;
}
.notifFaceavatar {
   float:left !important;
   margin:0 5px !important;
   padding:2px !important;
}
.notifFaceavatar img {
   height:45px !important;
   width:45px !important;
}
#fa_toolbar #fa_right #notif_list {
   border:1px solid #e0e0e0 !important;
   -webkit-border-radius:5px !important;
   -moz-border-radius:5px !important;
   border-radius:5px !important;
}
#fa_toolbar #fa_right #notif_list li.see_all {
   text-align:center !important;
   background-color:#f7f7f7 !important;
   -webkit-border-bottom-right-radius:5px !important;
   -webkit-border-bottom-left-radius:5px !important;
   -moz-border-radius-bottomright:5px !important;
   -moz-border-radius-bottomleft:5px !important;
   border-bottom-right-radius:5px !important;
   border-bottom-left-radius:5px !important;
}
#fa_toolbar #fa_right #notif_list a {
   color:#3B5998 !important;
}
#fa_toolbar #fa_right #notif_list li {
   border-top:1px solid #dddddd !important;
   border-left:0px !important;
   border-bottom:0px !important;
   border-right:0px !important;
}
#fa_toolbar #fa_right #notif_list li hr {
   border: 0px !important;
}

Cordialement,
Walt
Walt

Walt
Modéractif
Modéractif

Masculin
Messages : 5900
Inscrit(e) le : 08/09/2015

Voir le profil de l'utilisateur
Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Adapter un tuto du forum d'entraide portugais | Avatar dans les notifications

Message par Mat Mer 15 Aoû 2018 - 14:11

Bonjour Clin d'oeil,
Un grand merci, ça fonctionne parfaitement et le cadre s'intègre plutôt bien à la version ModernBB Visage souriant

Bonne journée Clin d'oeil
Mat

Mat
Membre habitué

Masculin
Messages : 1356
Inscrit(e) le : 05/09/2015

Voir le profil de l'utilisateur http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum