[TOUTES VERSIONS] Afficher la partie profil de la toolbar en bas à gauche avec effet slide

Milouze14 Mer 4 Mar 2015 - 19:48

,

actuellement lorsque vous cliquez sur le Pseudo dans la Toolbar le profil s'affiche juste en dessous......

Cette petite astuce bien sympa affichera le profil avec un effet coulissant en bas à gauche.

Un bouton de fermeture sera aussi inséré afin de faciliter le mouvement de souris en haut pour fermer cette notification.



On va donc passer par un JavaScript et ensuite personnaliser tout çà via la C.S.S.

Modules/HTML JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.


Déposez ce code:

Code:


//La partie profil
$(function(){
$(function(){
$('#fa_usermenu').before('<a id="M14_close_usermenu"title="Fermer le menu">X</a>');
$('#fa_welcome').click(function(){
$('ul#fa_menulist').slideToggle("slow");
})})});

//La fermeture de la partie profil
$(function(){
$(function(){
$('#M14_close_usermenu').click(function(){
$('ul#fa_menulist').slideToggle("fast");
})
})});




Pensez a cliquer sur le bouton  

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


Déposez ce contenu  :

Code:



/*Suppression de la couleur de fond bienvenue */
#fa_welcome
{

background-color:transparent !important;
color:#fff !important;
}

/*La partie profil*/
ul#fa_menulist
{
position:fixed !important;
bottom:0% !important ;
left:0px !important;
}

/*Le bouton de fermeture partie profil*/
#M14_close_usermenu
{
position: absolute !important;
right:15px !important;
text-decoration:none !important;
color:red !important;
cursor:pointer !important;
}



Pensez à valider les modifications en cliquant sur le bouton  






Admirez votre fofo les ami(e)s



Voila, c'est tout pour le moment .
Un soucis direction l'entraide
https://www.milouze14.com/f14-entraide-forumactif

Invité Mer 4 Mar 2015 - 21:27

Teten85 Mer 4 Mar 2015 - 22:24

Invité Mar 10 Mar 2015 - 11:56

ThunderTB Mer 25 Mar 2015 - 4:31

1baptiste Sam 20 Juin 2015 - 22:24

patriciadpt30 Mar 18 Aoû 2015 - 11:52

Invité Mer 19 Aoû 2015 - 13:52

Gae Mar 8 Sep 2015 - 15:32

Sacha Dim 13 Sep 2015 - 18:05

Grande013 Mer 30 Sep 2015 - 19:50

mariok Ven 2 Oct 2015 - 20:54

Invité Sam 3 Oct 2015 - 0:40

Ezio Jeu 29 Oct 2015 - 20:08

K-Surf Ven 30 Oct 2015 - 6:00

Ezio Sam 31 Oct 2015 - 15:37

JeYx83 Mer 4 Nov 2015 - 14:35

TOM_ Ven 6 Nov 2015 - 23:16

clost Sam 19 Mar 2016 - 19:18

dragon594 Lun 11 Avr 2016 - 1:55

SuperSpaceCab Ven 7 Oct 2016 - 17:05

SuperSpaceCab Mer 16 Nov 2016 - 6:49

Tony L Mer 16 Nov 2016 - 12:48

msfeettoes Ven 14 Avr 2017 - 9:33

petit coq Sam 22 Avr 2017 - 21:10

Psychotic Bitch Lun 28 Jan 2019 - 1:56

fred9545 Sam 30 Mar 2019 - 19:53

chrisnvidia Dim 31 Mar 2019 - 13:41

Splash Dim 31 Mar 2019 - 14:37

Constellation Jeu 10 Juin 2021 - 2:27

J'adore l'effet, merci pour ce code