Membres connectés récemment
[PHPBB2] Animer l'arrivée d'un message privé dans la barre de navigation
2 participants
Page 1 sur 1
- Version du forum :PHPBB2
- Templates modifiés :oui
- Navigateur :Chrome
Re coucou Philippe,
Je reviens vers toi car je me demandais si il était possible d'animer tout en changeant la couleur, l'onglet des messages privés à l'arrivée d'un nouveau message privé pour bien le distinguer de d'habitude ?
Voici mon css :
overall_header
Un tout grand merci ^^
Je reviens vers toi car je me demandais si il était possible d'animer tout en changeant la couleur, l'onglet des messages privés à l'arrivée d'un nouveau message privé pour bien le distinguer de d'habitude ?
Voici mon css :
overall_header
Un tout grand merci ^^
Milouze14 aime ce message
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:
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:
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:
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:
Le script:
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
Encore un grand merci en tout cas
Sujets similaires
» [PHPBB2] Barre de navigation qui descend à l'arrivée d'un message privé
» [PHPBB2] Ajouter un bouton "merci"dans la barre édition.
» [PHPBB2] Barre de navigation
» [PHPBB2] Mise en page dans le corps du message uniquement sur le 1er message
» [PHPBB2]Ajouter l'infobulle au survol des boutons de la barre de navigation
» [PHPBB2] Ajouter un bouton "merci"dans la barre édition.
» [PHPBB2] Barre de navigation
» [PHPBB2] Mise en page dans le corps du message uniquement sur le 1er message
» [PHPBB2]Ajouter l'infobulle au survol des boutons de la barre de navigation
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum