Astuces Forumactif
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Astuces Forumactif

EDGE/ PHPBB2 / PHPBB3/ PUNBB / INVISION/ MODERNBB/ AWESOMEBB
 
AccueilAccueil  PortailPortail  Connexion  S'enregistrerS'enregistrer  
Le Deal du moment : -20%
Manette Xbox Series X sans fil Carbon Black à ...
Voir le deal
47.99 €

 

 [PHPBB2] Onglets du profil façon invision

Aller en bas 
+14
dragon594
Gypsy Water.
clost
Grande013
Tranchees
Sacha
mariok
1baptiste
Dada
Eczema Help
ThunderTB
fleur78
Aenigma
Milouze14
18 participants
AuteurMessage
Milouze14
Fondateur

Milouze14



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 2 Mar 2014 - 8:57

coucou ,

la modification que je vous donne aujourd'hui est prévue pour tous les onglets clin oeil .


On passera par un javascript avec tous les onglets prédéfinis  hinhin .
C'est à dire que si l'onglet Facebook (par exemple) n'est pas présent vous pourrez toujours l'activer,
ce dernier sera prit en compte dans le Javascript  hinhin .

On donnera ensuite l'apparence dans la C.S.S .

L'aperçu imagé :

[PHPBB2] Onglets du profil façon invision 182


Modules/HTML JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite comme:"Onglet profil façon Invision"
Cocher sur toutes les pages.

collez tout ce contenu:
Code:

//ON DONNE UNE CLASS A LA BALISE GEN
$(function(){
$('
a.mainmenu[href^="/profile?mode=editprofile&page_profil=informations"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=preferences"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=signature"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=attachments"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=avatars"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=friendsfoes"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=notifications"],
a.mainmenu[href^="/search?search_id=watchsearch"],
a.mainmenu[href^="/search?search_id=favouritesearch"],
a.mainmenu[href^="/search?search_id=draftsearch"],
a.mainmenu[href^="/rpg_sheet_edit?"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=facebook"]').closest(".gen").addClass('M14');
});
//ON DONNE UNE CLASS A LA BALISE TD
$(function(){
$('
a.mainmenu[href^="/profile?mode=editprofile&page_profil=informations"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=preferences"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=signature"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=attachments"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=avatars"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=friendsfoes"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=notifications"],
a.mainmenu[href^="/search?search_id=watchsearch"],
a.mainmenu[href^="/search?search_id=favouritesearch"],
a.mainmenu[href^="/search?search_id=draftsearch"],
a.mainmenu[href^="/rpg_sheet_edit?"],
a.mainmenu[href^="/profile?mode=editprofile&page_profil=facebook"]')

.closest("td").addClass('M14_td');
});
//ON CREER UNE CELLULE AVEC UNE CLASS
$(function(){
$(".M14_td").closest("table").append("
<tr><td class='M14_ong_strong'><div></div>
</td></tr>");
});
//ON DONNE UNE CLASS AU TABLEAU
$(function(){
$(".M14_td").closest("table").addClass('M14_table');
});

//ON DEPLACE L ONGLET SELECTIONNE DANS LA CELLULE
$(function(){
$(".M14_td .gen strong ").clone().appendTo("td.M14_ong_strong div");
});


Pensez a cliquer sur le bouton Valid


Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Collez ceci:
Code:

/*LE TABLEAU QUI COMPORTE L ENSEMBLE*/
.M14_table
{
border-collapse:collapse;/*on fusionne les bordures*/
}
/*LE BLOC DES ONGLETS*/
td.M14_td
{
text-align:right;/*on place les onglets a droite*/
background:#333333;/*la couleur de fond*/
padding:4px;/*on donne un espace */
}
/*ON CACHE LES TRAITS VERTICAUX AVEC LA MEME COULEUR QUE LE BACKGROUND PRECEDENT*/
td.M14_td span.gen.M14, td.M14_td span.gen
{
color:#333333 !important;/*on donne une couleur de police */
}
/*LES LIENS DES ONGLETS*/
td.M14_td a.mainmenu
{
text-decoration:none !important;/*on supprime le soulignement*/
color:#666666 !important;/*on donne une couleur de police*/
font-size:10px !important;/*on donne une taille de police*/
padding: 4px 6px;/*on donne un espace */
margin-left: -5px;
margin-right: -5px;
}
/*LES ONGLETS SELECTIONNES*/
td.M14_td span.gen strong
{
color:#ffffff !important;/*on donne une couleur de police*/
font-size:10px !important;/*on donne une taille de police*/

background-color: #303B4A;/*on demande une couleur de fond*/
padding: 4px 6px;/*on donne un espace */
}

/*LE BLOC DE L ONGLETS SELECTIONNE*/
td.M14_ong_strong
{
background-color: #303B4A;/*on demande une couleur de fond*/
}
/* L ONGLET SELECTIONNE DANS LA PARTIE BASSE*/
td.M14_ong_strong div
{
padding: 4px 6px;/*on donne un espace */
font-size:10px !important;/*on donne une taille de police*/
color:#666666 !important;/*on donne une couleur de police*/
margin-left:10px;/*on decale vers la droite de 10px;*/
}

Pensez à valider les modifications en cliquant sur le bouton  Valid


La C.S.S est commentée pour vos éventuels changements .
Soyez vigilants sur le troisième commentaire car la class correspondante
cache les traits verticaux .

Il faut que le background et cette class est la même couleur  hinhin 

Ici  regardeplusbas 

Code:


/*LE BLOC DES ONGLETS*/
td.M14_td
{
text-align:right;/*on place les onglets a droite*/
background:#333333;/*la couleur de fond*/
}
/*ON CACHE LES TRAITS VERTICAUX AVEC LA MEME COULEUR QUE LE BACKGROUND PRECEDENT*/
td.M14_td span.gen.M14, td.M14_td span.gen
{
color:#333333;/*on donne une couleur de police */
}





Dernière édition par Milouze14 le Lun 29 Nov 2021 - 7:52, édité 8 fois
Revenir en haut Aller en bas
https://www.milouze14.com
Invité
Invité
Anonymous



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 2 Mar 2014 - 12:32

Merci Phil
Revenir en haut Aller en bas
Aenigma
Milouzien

Aenigma



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 2 Mar 2014 - 16:56

Merci Philippe, par curiosité.
Revenir en haut Aller en bas
http://atlan.niceboard.org/
Invité
Invité
Anonymous



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyJeu 20 Mar 2014 - 20:42

Merci
Revenir en haut Aller en bas
fleur78
Milouzien

fleur78



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptySam 2 Aoû 2014 - 10:08

a voir
Revenir en haut Aller en bas
http://graphfleur78.forumactif.org/
ThunderTB
Milouzien

ThunderTB



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyVen 5 Sep 2014 - 5:40

Merci
Revenir en haut Aller en bas
http://hockeyfederation.forumgratuit.org/forum
Eczema Help
Milouzien

Eczema Help



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 12 Oct 2014 - 19:46

Super !
Revenir en haut Aller en bas
http://eczemahelp.forumactif.org/
Dada
Milouzien

avatar



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyMer 31 Déc 2014 - 18:07

Merci beaucoup !
Revenir en haut Aller en bas
Invité
Invité
Anonymous



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 4 Jan 2015 - 18:12

Merci
Revenir en haut Aller en bas
Invité
Invité
Anonymous



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 4 Jan 2015 - 18:12

Merci beaucoup !
Revenir en haut Aller en bas
1baptiste
Milouzien

1baptiste



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 1 Mar 2015 - 22:42

Merci beaucoup !
Revenir en haut Aller en bas
http://horus.forumactif.com/
mariok
Membre regretté

mariok



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyMer 10 Juin 2015 - 18:42

Merci beaucoup !
Revenir en haut Aller en bas
http://www.amarid.net
1baptiste
Milouzien

1baptiste



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyVen 12 Juin 2015 - 10:00

Merci beaucoup !
Revenir en haut Aller en bas
http://horus.forumactif.com/
Invité
Invité
Anonymous



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyVen 7 Aoû 2015 - 21:41

Merci beaucoup !
Revenir en haut Aller en bas
Sacha
Milouzien

Sacha



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyLun 7 Sep 2015 - 22:54

Merci beaucoup !
Revenir en haut Aller en bas
https://amis-pub.forumactif.com/
Tranchees
Milouzien

Tranchees



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyJeu 10 Sep 2015 - 11:16

Merci beaucoup !
Revenir en haut Aller en bas
http://www.snapchatforum.fr/
Grande013
Milouzien

avatar



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 27 Sep 2015 - 15:47

Merci beaucoup !
Revenir en haut Aller en bas
clost
Milouzien

clost



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyLun 21 Mar 2016 - 21:35

merci à toi  clin oeil
Revenir en haut Aller en bas
https://www.dyane-collection-passion.net
Gypsy Water.
Milouzien

avatar



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 10 Avr 2016 - 19:23

Merci beaucoup !
Revenir en haut Aller en bas
dragon594
Milouzien

dragon594



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyMar 16 Aoû 2016 - 22:48

Merci beaucoup !
Revenir en haut Aller en bas
https://dragon-graphisme59.forumactif.org/
Queen G.
Milouzien

avatar



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptySam 29 Oct 2016 - 19:46

Superbe merci **
Revenir en haut Aller en bas
https://lustforlife.forumactif.com/
Kaeyla
Milouzien

Kaeyla



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 16 Avr 2017 - 7:47

Merci beaucoup !
Revenir en haut Aller en bas
https://sweethome.forumactif.com
Chocolatine
Milouzien

Chocolatine



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptySam 22 Juil 2017 - 23:14

Merci beaucoup !
Revenir en haut Aller en bas
http://bit.ly/2oPwMrS
Psychotic Bitch
Milouzien

Psychotic Bitch



[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision EmptyDim 27 Jan 2019 - 15:44

Merci beaucoup !
Revenir en haut Aller en bas
https://wildestdreams.forumactif.com/
Contenu sponsorisé





[PHPBB2] Onglets du profil façon invision Empty
MessageSujet: Re: [PHPBB2] Onglets du profil façon invision   [PHPBB2] Onglets du profil façon invision Empty

Revenir en haut Aller en bas
 
[PHPBB2] Onglets du profil façon invision
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» [PHPBB2] Afficher le profil des messages façon Invision et bien plus..
» [PHPBB2] Les onglets du profil quelque peu original
» [PHPBB2] Afficher le nombre d'Annonce & Note façon Punbb
» [PHPBB2] Afficher le logo devant les Pseudos index et sous forums, façon mini avatar
» [PHPBB2]Afficher le profil à droite

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Astuces Forumactif :: Astuces Forumactif :: Les astuces Phpbb2-
Sauter vers: