Connexion

Récupérer mon mot de passe

Derniers sujets
» *RESOLU*[PhpBB2] Changer le lien d'une image par une icone font awesone
[PHPBB2] Onglets du profil façon invision Clock-10Aujourd'hui à 14:57 par Milouze14

» *RESOLU*[AwesomeBB] Profils en onglets
[PHPBB2] Onglets du profil façon invision Clock-10Aujourd'hui à 12:04 par Milouze14

» histoire du Jour sans fin
[PHPBB2] Onglets du profil façon invision Clock-10Hier à 8:11 par Quad Daniel

» Test d'intelligence des politiciens-(e) histoire blagounette
[PHPBB2] Onglets du profil façon invision Clock-10Ven 23 Aoû 2019 - 9:22 par Quad Daniel

» Règlement de l'entraide Forumactif
[PHPBB2] Onglets du profil façon invision Clock-10Jeu 22 Aoû 2019 - 11:42 par BADLANDS

» [AwesomeBB] Problème avec le tuto "AutoSuggestion" - Incompatible version AwesomeBB
[PHPBB2] Onglets du profil façon invision Clock-10Mer 21 Aoû 2019 - 12:14 par MathisB

» *RESOLU*[AwesomeBB] Barre de progression sur la page - AwesomeBB
[PHPBB2] Onglets du profil façon invision Clock-10Mar 20 Aoû 2019 - 21:17 par Milouze14

» *RESOLU*[PhpBB2] Insérer la valeur d'un champ personnalisé dans une page HTML
[PHPBB2] Onglets du profil façon invision Clock-10Mar 20 Aoû 2019 - 19:11 par Milouze14

» *CORBEILLE*[PhpBB2] Récupérer la valeur d'un input
[PHPBB2] Onglets du profil façon invision Clock-10Lun 19 Aoû 2019 - 18:42 par Milouze14

» *RESOLU*[PhpBB3] Prévisualisation directe
[PHPBB2] Onglets du profil façon invision Clock-10Ven 16 Aoû 2019 - 11:06 par Milouze14

» *RESOLU*[PhpBB2] l'image s'éclairci dans le codage
[PHPBB2] Onglets du profil façon invision Clock-10Lun 12 Aoû 2019 - 6:30 par Milouze14

» *RESOLU*[PhpBB2] Vérifier valeur dans InArray (Jquery)
[PHPBB2] Onglets du profil façon invision Clock-10Sam 10 Aoû 2019 - 6:24 par Milouze14

» *RESOLU*[PhpBB2] Récupérer valeur checkbox
[PHPBB2] Onglets du profil façon invision Clock-10Jeu 8 Aoû 2019 - 4:17 par Milouze14

» [Toutes versions] Utiliser les variables utilisateur/forum
[PHPBB2] Onglets du profil façon invision Clock-10Mer 31 Juil 2019 - 19:36 par photoclic

» *RESOLU*[PhpBB2] Encadrement des photos dans le .preview .postbody
[PHPBB2] Onglets du profil façon invision Clock-10Mer 31 Juil 2019 - 19:19 par Milouze14

» *RESOLU*[PhpBB3] Nombre de messages et membres su qeel
[PHPBB2] Onglets du profil façon invision Clock-10Mer 31 Juil 2019 - 17:01 par no_way

» *RESOLU*[PhpBB2] Prévisualisation en direct
[PHPBB2] Onglets du profil façon invision Clock-10Lun 29 Juil 2019 - 17:42 par Milouze14

» *RESOLU*[PhpBB2] La version web ne s'affiche pas sur "mon" IPAD.
[PHPBB2] Onglets du profil façon invision Clock-10Ven 26 Juil 2019 - 19:51 par Milouze14

» [AwesomeBB] Problème avec le tuto "AutoSuggestion" - Incompatible version AwesomeBB
[PHPBB2] Onglets du profil façon invision Clock-10Dim 21 Juil 2019 - 6:07 par Milouze14

» [Toutes versions]Remplacer les icônes de l'éditeur par des icônes FontAwesome
[PHPBB2] Onglets du profil façon invision Clock-10Sam 20 Juil 2019 - 11:23 par Morane

[PHPBB2] Onglets du profil façon invision

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

Milouze14
Milouze14
Fondateur

MessageMilouze14 le Dim 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

-Astuce des Forums Milouze14&Compagnie-





  • Astuce postée par:
    Réponse automatique:

    Merci de cliquer ici pour voir le message

Pour toute information,merci de contacter un Membre du Staff
[PHPBB2] Onglets du profil façon invision Staff10


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 */
}





Voilà,c'est tout pour le moment.
Un soucis?
Direction l'entraide clin oeil
https://www.milouze14.com/f108-entraide-tous-supports


Dernière édition par Milouze14 le Dim 7 Oct 2018 - 9:21, édité 6 fois
Anonymous
Invité
Invité

MessageInvité le Dim 2 Mar 2014 - 12:32

Merci Phil
Aenigma
Aenigma
Milouzien

MessageAenigma le Dim 2 Mar 2014 - 16:56

Merci Philippe, par curiosité.
Anonymous
Invité
Invité

MessageInvité le Jeu 20 Mar 2014 - 20:42

Merci
fleur78
fleur78
Milouzien

Messagefleur78 le Sam 2 Aoû 2014 - 10:08

a voir
avatar
ThunderTB
Milouzien

MessageThunderTB le Ven 5 Sep 2014 - 5:40

Merci
Eczema Help
Eczema Help
Milouzien

MessageEczema Help le Dim 12 Oct 2014 - 19:46

Super !
avatar
Dada
Milouzien

MessageDada le Mer 31 Déc 2014 - 18:07

Merci beaucoup !
{12°S}coco-lapin
{12°S}coco-lapin
Milouzien

Message{12°S}coco-lapin le Dim 4 Jan 2015 - 18:12

Merci
{12°S}coco-lapin
{12°S}coco-lapin
Milouzien

Message{12°S}coco-lapin le Dim 4 Jan 2015 - 18:12

Merci beaucoup !
1baptiste
1baptiste
Milouzien

Message1baptiste le Dim 1 Mar 2015 - 22:42

Merci beaucoup !
mariok
mariok
Membre regretté

Messagemariok le Mer 10 Juin 2015 - 18:42

Merci beaucoup !
1baptiste
1baptiste
Milouzien

Message1baptiste le Ven 12 Juin 2015 - 10:00

Merci beaucoup !
Anonymous
Invité
Invité

MessageInvité le Ven 7 Aoû 2015 - 21:41

Merci beaucoup !
Sacha
Sacha
Milouzien

MessageSacha le Lun 7 Sep 2015 - 22:54

Merci beaucoup !
Tranchees
Tranchees
Milouzien

MessageTranchees le Jeu 10 Sep 2015 - 11:16

Merci beaucoup !
Grande013
Grande013
Milouzien

MessageGrande013 le Dim 27 Sep 2015 - 15:47

Merci beaucoup !
clost
clost
Milouzien

Messageclost le Lun 21 Mar 2016 - 21:35

merci à toi  clin oeil
avatar
Gypsy Water.
Milouzien

MessageGypsy Water. le Dim 10 Avr 2016 - 19:23

Merci beaucoup !
dragon594
dragon594
Milouzien

Messagedragon594 le Mar 16 Aoû 2016 - 22:48

Merci beaucoup !
Queen G.
Queen G.
Milouzien

MessageQueen G. le Sam 29 Oct 2016 - 19:46

Superbe merci **
Kaeyla
Kaeyla
Milouzien

MessageKaeyla le Dim 16 Avr 2017 - 7:47

Merci beaucoup !
Chocolatine
Chocolatine
Milouzien

MessageChocolatine le Sam 22 Juil 2017 - 23:14

Merci beaucoup !
Psychotic Bitch
Psychotic Bitch
Milouzien

MessagePsychotic Bitch le Dim 27 Jan 2019 - 15:44

Merci beaucoup !

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

Créer un compte ou se connecter pour répondre

Vous devez être membre pour répondre.

S'enregistrer

Rejoignez notre communauté ! C'est facile !


S'enregistrer

Connexion

Vous êtes déjà membre ? Aucun soucis, cliquez ici pour vous connecter.


Connexion

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