[PHPBB2] Animer l'arrivée d'un message privé dans la barre de navigation

Coucou Ombi,
alors , on va déposer un script qui va ajouter deux class lors de nouveau(x) message(s) privé(s).
.blink qui servira a faire clignoter le texte.
Et une autre:
.M14_MP_color qui servira a changer sa couleur.

Tu peux augmenter le clignotement dans la css en modifiant le chiffre (1 ) ici:

Code:



.blink{animation: blink 1s linear infinite;}


Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mets un titre explicite.
Coches sur toutes les pages ou sur les pages que tu souhaites.


Déposes ceci:

Code:


$(function(){
$('a.mainmenu[href="/privmsg?folder=inbox"]').each(function(){
var a=$(this).find('img[id="i_icon_mini_new_message"]').length;
if(a)
{
$(this).addClass('blink M14_MP_color');
}
});});


Penses a cliquer sur le bouton



Dans la feuille de style:

Pour l'animation il faut désactiver l’optimisation en bas de page
Optimiser votre CSS ==> cocher non

Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:


/*Permet de faire clignoter un element*/
@keyframes blink{0%{opacity: 0;}50%{opacity: .5;}100%{opacity: 1;}}
/*ON DETERMINE LE NOMBRE DE SECONDE ICI (1)*/
.blink{animation: blink 1s linear infinite;}
/*LA COULEUR DU LIEN SI NOUVEAU MP*/
a.mainmenu.M14_MP_color{color:#F62800!important; }


Penses a cliquer sur le bouton


On peut encore ajouter des notifications sur la toolbar par exemple mais j’attends ton avis


Une autre animation avec un plus avec la toolbar:
La c.s.s:

Code:

/*Permet de faire clignoter un element*/
@keyframes blink{0%{opacity: 0;}50%{opacity: .5;}100%{opacity: 1;}}
/*ON DETERMINE LE NOMBRE DE SECONDE ICI (1)*/
.blink{animation: blink 1s linear infinite;}
/*LA COULEUR DU LIEN SI NOUVEAU MP*/
a.blink.M14_MP_color{color:#F62800!important; }
#fa_menulist li.blink.M14_MP_color a[href$="/privmsg?folder=inbox"]{color:#F62800!important; }

Le script:

Code:

$(function(){$(function(){
$('a.mainmenu[href="/privmsg?folder=inbox"]').each(function(){
var a=$(this).find('img[id="i_icon_mini_new_message"]').length;
if(a)
{
  $('#fa_right').addClass('welcome');
$('a[href$="/privmsg?folder=inbox"]').closest('li').addClass('blink M14_MP_color');
$(this).addClass('blink M14_MP_color');
}
});})});

Re coucou Philippe j'adore le résultat est parfait par contre excuse-moi je n'ai pas bien compris avec les notifications sur la toolbar car j'ai essayé le second script que tu m'as donné mais cela ne fait rien est-ce parce que je n'ai plus de toolbar et que mes notifications ont été codées comme telles =>

Encore un grand merci en tout cas

Re de rien Ombi,

est-ce parce que je n'ai plus de toolbar

Ah vi c'est surement cela  



Ta toolbar n'est pas activée sur ton fofo ?
Modules/Toolbar/Configuration/Options

Activer la toolbar :Oui

Si cela ne t’intéresse pas on laisse ainsi  

Re coucou Philippe, bon ben en fait ma toolbar est pourtant activée du coup je ne comprend pas qu'il n'y ait rien qui fonctionne

Voici le CSS de mes notifications actuelles :

Code:

Encore merci pour le temps que tu m'accordes Philippe

C'est bien cela chère amie ,
le script que j'avais concocté n'est pas compatible avec la css de ton fofo,
donc vaut mieux rester avec la première solution, à moins que tu désires avoir autre chose ?

Oki Philippe un grand merci ne t'inquiète pas on va laisser ainsi c'est parfait encore un grand merci

Très belle soirée et au plaisir comme toujours

De rien Ombi,
bonne soirée à toi aussi .

Merci beaucoup