Derniers sujets*
» [TOUTES VERSIONS] Afficher une belle infobulle au survol des boutons J aime
par clost Sam 17 Avr 2021 - 12:03
» [MODERNBB] Supprimer l'effet scroll sur la barre de navigation
par Milouze14 Lun 12 Avr 2021 - 7:56
» [MODERNBB]Retirer les crochets des groupes dans le Qeel
par Serah Sam 10 Avr 2021 - 22:48
» [TOUTES VERSIONS]Afficher de belles infobulles Tooltipster
par Stefano36 Mer 31 Mar 2021 - 21:57
» [PHPBB2] Afficher le nombre de message privé non lus sur la toolbar etc
par Constellation Mer 31 Mar 2021 - 1:59
» [PHPBB2] Couleur spécifique aux membres d'un rang dans les messages
par Constellation Mer 31 Mar 2021 - 1:43
» [PHPBB2] Remplacer le mot Invité
par Constellation Mer 31 Mar 2021 - 1:37
» [TOUTES VERSIONS] Héberger du css dans une page html comme sur la feuille de style
par Constellation Mer 31 Mar 2021 - 1:31
» [TOUTES VERSIONS] Sauvegarder le contenu de l'éditeur
par Constellation Mer 31 Mar 2021 - 1:30
» [TOUTES VERSIONS]Message de confirmation de fermeture de la page pour les membres distraits
par Constellation Mer 31 Mar 2021 - 1:24
» [TOUTES VERSIONS] Afficher un texte dans l'éditeur avec transition
par Constellation Mer 31 Mar 2021 - 1:14
» [TOUTES VERSIONS] Modifier les textes de la barre de navigation
par Constellation Mar 30 Mar 2021 - 22:53
» [TOUTES VERSIONS] Installer MESSENGER Forumactif sur votre forum (Version Française)
par Constellation Mar 30 Mar 2021 - 22:50
» [TOUTES VERSIONS] Afficher les likes seulement sur les messages des autres membres et plus encore
par Milouze14 Mar 30 Mar 2021 - 6:14
» [TOUTES VERSIONS] Modifier la couleur des pseudos mentionner dans l'éditeur
par Constellation Dim 28 Mar 2021 - 19:34
» [TOUTES VERSIONS] Une page html connexion/deconnexion...
par Constellation Dim 28 Mar 2021 - 19:31
» [TOUTES VERSIONS] Modifier les menus défilant de l'éditeur
par Milouze14 Lun 22 Mar 2021 - 7:30
» [TOUTES VERSIONS] Faire AGRANDIR l'image ou le Smiley au passage de la souris
par photoclic Dim 21 Mar 2021 - 19:24
» [TOUTES VERSIONS]Mise en place automatique décorations
par clost Dim 21 Fév 2021 - 11:37
» [AWESOMEBB] Outils de modération rapide
par Milouze14 Jeu 11 Fév 2021 - 6:04
par clost Sam 17 Avr 2021 - 12:03
» [MODERNBB] Supprimer l'effet scroll sur la barre de navigation
par Milouze14 Lun 12 Avr 2021 - 7:56
» [MODERNBB]Retirer les crochets des groupes dans le Qeel
par Serah Sam 10 Avr 2021 - 22:48
» [TOUTES VERSIONS]Afficher de belles infobulles Tooltipster
par Stefano36 Mer 31 Mar 2021 - 21:57
» [PHPBB2] Afficher le nombre de message privé non lus sur la toolbar etc
par Constellation Mer 31 Mar 2021 - 1:59
» [PHPBB2] Couleur spécifique aux membres d'un rang dans les messages
par Constellation Mer 31 Mar 2021 - 1:43
» [PHPBB2] Remplacer le mot Invité
par Constellation Mer 31 Mar 2021 - 1:37
» [TOUTES VERSIONS] Héberger du css dans une page html comme sur la feuille de style
par Constellation Mer 31 Mar 2021 - 1:31
» [TOUTES VERSIONS] Sauvegarder le contenu de l'éditeur
par Constellation Mer 31 Mar 2021 - 1:30
» [TOUTES VERSIONS]Message de confirmation de fermeture de la page pour les membres distraits
par Constellation Mer 31 Mar 2021 - 1:24
» [TOUTES VERSIONS] Afficher un texte dans l'éditeur avec transition
par Constellation Mer 31 Mar 2021 - 1:14
» [TOUTES VERSIONS] Modifier les textes de la barre de navigation
par Constellation Mar 30 Mar 2021 - 22:53
» [TOUTES VERSIONS] Installer MESSENGER Forumactif sur votre forum (Version Française)
par Constellation Mar 30 Mar 2021 - 22:50
» [TOUTES VERSIONS] Afficher les likes seulement sur les messages des autres membres et plus encore
par Milouze14 Mar 30 Mar 2021 - 6:14
» [TOUTES VERSIONS] Modifier la couleur des pseudos mentionner dans l'éditeur
par Constellation Dim 28 Mar 2021 - 19:34
» [TOUTES VERSIONS] Une page html connexion/deconnexion...
par Constellation Dim 28 Mar 2021 - 19:31
» [TOUTES VERSIONS] Modifier les menus défilant de l'éditeur
par Milouze14 Lun 22 Mar 2021 - 7:30
» [TOUTES VERSIONS] Faire AGRANDIR l'image ou le Smiley au passage de la souris
par photoclic Dim 21 Mar 2021 - 19:24
» [TOUTES VERSIONS]Mise en place automatique décorations
par clost Dim 21 Fév 2021 - 11:37
» [AWESOMEBB] Outils de modération rapide
par Milouze14 Jeu 11 Fév 2021 - 6:04
Les statistiques du forum
[TOUTES VERSIONS] Afficher une barre des tâches façon Windows 10 sur votre forum
Page 1 sur 1 • Partagez

je pense que je vais en régaler plus d'un ,
l'astuce consiste a déposer une barre des tâches ayant l'apparence de celle de Windows 10, elle sera pourvue de diverses fonctions.
Et aussi truffée de transitions sur les apparences diverses.
Elle arrivera progressivement en bas de page de votre forum et au survol
de cette dernière les icônes apparaitront.
Puis le bouton de démarrage affichera une copie que vous pouvez avoir
en cliquant sur votre pseudo présent sur la toolbar.
Et encore bien d'autres fonctions,
La C.S.S est assez conséquente et assez complexe les ami(e)s.
Allez voici les captures pour un fofo version phpbb2 , mais rassurez vous la barre est compatible toutes versions.
![[TOUTES VERSIONS] Afficher une barre des tâches façon Windows 10 sur votre forum 0150](https://i.servimg.com/u/f18/11/26/21/37/0150.png)
![[TOUTES VERSIONS] Afficher une barre des tâches façon Windows 10 sur votre forum 0230](https://i.servimg.com/u/f18/11/26/21/37/0230.png)
![[TOUTES VERSIONS] Afficher une barre des tâches façon Windows 10 sur votre forum 0314](https://i.servimg.com/u/f18/11/26/21/37/0314.png)
![[TOUTES VERSIONS] Afficher une barre des tâches façon Windows 10 sur votre forum 0411](https://i.servimg.com/u/f18/11/26/21/37/0411.png)
Cette même barre décalera a l'affichage le bas de page automatiquement et vice versa à la fermeture.
Dans le template overall_footer_end :
Affichage/Templates/
Général/overall_footer_end
Juste avant ceci:
- Code:
<!-- BEGIN switch_facebook_login -->
Déposez ceci:
- Code:
<!-- BEGIN switch_user_logged_in -->
<div id="M14_Windows"style="display:none;">
<div class="M14_Win_cont"style="display:none;">
<div id="M14_Win_Cont_one">
<div class="M14_Win_User"title="Voir mon profil">
<img src="https://i.servimg.com/u/f18/11/26/21/37/contac11.png"alt="User"align="absmiddle"/><span class="USERNAME">
</span>
</div>
<div class="M14_Win_groups">
<img src="https://i.servimg.com/u/f18/11/26/21/37/confer10.png"alt="Groupes"align="absmiddle"/><a href="/groups">Groupes</a>
</div>
<div class="M14_Win_members">
<img src="https://i.servimg.com/u/f18/11/26/21/37/find_u10.png"alt="Membres"align="absmiddle"/><a href="/memberlist">Membres</a>
</div>
<div class="M14_Win_user_Prof"style="display:none;"></div>
</div>
<div id="M14_Win_Cont_two"></div>
</div>
<div class="M14_Win_Logo"title="Afficher mon contenu"><img src="https://i.servimg.com/u/f18/11/26/21/37/logo10.png"align="absmiddle"alt="Logo"/></div>
<div class="M14_Win_Search"></div>
<div id="M14_Win_Mp"><a href="/privmsg?folder=inbox"class="M14_Win_MP"title="Voir ma messagerie privée">
<img src="https://i.servimg.com/u/f87/19/99/37/49/email_10.png"alt="Mp"/></a>
</div>
<div id="M14_Win_avatar"><a href="/profile?mode=editprofile&page_profil=avatars"title="Modifier mon avatar">
<img src="https://i.servimg.com/u/f87/19/99/37/49/yahoo_10.png"alt="Avatar"/></a>
</div>
<div id="M14_Win_Sign"><a href="/profile?mode=editprofile&page_profil=signature"title="Modifier ma signature">
<img src="https://i.servimg.com/u/f87/19/99/37/49/notepa10.png"alt="Signature"/></a>
</div>
<div class="M14_Win_Google">
<a href="https://www.google.fr/"target="_blank">
<img src="https://i.servimg.com/u/f87/19/99/37/49/google10.png"align="absmiddle"alt="Google"title="Google est votre ami"/></a>
</div>
<div class="M14_Milouze"title="Milouze14 Forum d'entraide Forum actif">
<a href="https://www.milouze14.com/"target="_blank">
<img src="https://i.servimg.com/u/f87/19/99/37/49/firefo10.png"alt="Milouze14"align="absmiddle"/></a>
</div>
<div class="M14_btn_Window">
<img src="https://i.servimg.com/u/f18/11/26/21/37/sort_d10.png"alt="Réduire"title="Réduire"align="absmiddle"/>
</div>
<div class="M14_btn_Window_close"title="Ouvrir la barre des tâche"style="display:none;">
<img src="https://i.servimg.com/u/f21/11/26/21/37/up-5010.png"alt="Ouvrir la barre des tâches"align="absmiddle"/>
</div>
<div id="M14_hour"></div>
<script type="text/javascript">
function date(){var today=new Date();var date_heure="";
h=today.getHours();m=today.getMinutes();s=today.getSeconds();if(h<10){h='0'+h}if(m<10){m='0'+m}if(s<10){s='0'+s}date_heure=''+h+'h'+m+'m'+s+'';document.getElementById('M14_hour').innerHTML=date_heure}setInterval("date()",1000);
</script>
</div>
<!-- END switch_user_logged_in -->
<script type="text/javascript">
$(function(){
$(function(){
$('#fa_search').clone().appendTo('.M14_Win_Search');
$('.M14_Win_Search #fa_textarea').attr('placeHolder','Rechercher sur le forum......');
$('#fa_menu #fa_menulist').clone().appendTo('.M14_Win_user_Prof');
$('#fa_usermenu').clone().appendTo('#M14_Win_Cont_two');
});
});
</script>
<script type="text/javascript">
$(function(){
$('#M14_Windows').delay('1000').fadeIn(1600);
$('#wrap , .bodylinewidth, #ipbwrapper , .pun').delay('800').animate({paddingBottom: '45px'});
$('.M14_Win_Logo').click(function(){
$('.M14_Win_cont').toggle();
$('.M14_Win_User').click(function(){
$('.M14_Win_user_Prof').toggle();
});
});
});
</script>
<script type="text/javascript">
$(function(){
$('.M14_btn_Window').click(function(){
$('.M14_Win_cont,.M14_Win_user_Prof').fadeOut();
$('#M14_Windows, #wrap , .bodylinewidth, #ipbwrapper , .pun').delay('800').animate({height: '0px',padding: '0px'});
$('.M14_btn_Window_close').delay(1500).fadeIn();
});
});
</script>
<script type="text/javascript">
$(function(){
$('#M14_Windows').hover(function(){
$('#M14_Win_Mp ,#M14_Win_avatar ,#M14_Win_Sign ,
.M14_Win_Google ,.M14_Milouze ,.M14_btn_Window').animate({marginTop:'-30px'})
});});
</script>
<script type="text/javascript">
$(function(){
$('.M14_btn_Window_close').click(function(){
$(this).fadeOut(800);
$('.M14_Win_User').click(function(){
$('.M14_Win_user_Prof').toggle();
});
$('#wrap , .bodylinewidth, #ipbwrapper , .pun').delay('800').animate({paddingBottom: '45px'});
$('#M14_Windows').delay('800').animate({height: '40px'});
});
});
</script>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>


Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Déposez ceci:
- Code:
/*Debut barre des taches facon Windows 10 par Milouze14*/
/*les transitions*/
#M14_Windows ,.M14_btn_Window ,.M14_Win_cont ,
.M14_Milouze ,.M14_Win_Google,#M14_Win_Mp,#M14_Win_avatar ,#M14_Win_Sign ,.M14_btn_Window_close
{
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition:all 1s ease-in-out;
transition: all 1s ease-in-out;
}
/*LA COULEUR DE LA BARRE ET LE RESTE*/
#M14_Windows ,.M14_btn_Window,.M14_btn_Window_close{background:#222; }
/*LA COULEUR DE LA BARRE ET LE RESTE AU SURVOL*/
#M14_Windows:hover ,.M14_Win_cont:hover ,#M14_Windows:hover .M14_btn_Window
{background:#445555; }
#M14_Windows:hover #fa_search #fa_textarea{background:transparent !important;}
#M14_Windows
{
position:fixed;
left:0px;
right:0px;
bottom:0px;
width:100%;
height:40px;
-khtml-opacity:0.8;
-ms-filter:"alpha(opacity=80)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
filter:alpha(opacity=80);
opacity:0.8;
z-index:999;
}
#M14_Windows:hover
{
-khtml-opacity:1;
-ms-filter:"alpha(opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter:alpha(opacity=100);
opacity:1;
}
.M14_Win_cont
{
position:fixed;
left:0px;
bottom:40px;
background:#222 ;
width:250px;
height:300px;
padding:5px;
}
#M14_Win_Cont_one
{
position:absolute;
margin-top:5px;
width:250px;
height:150px;
}
.M14_Win_User, .M14_Win_groups , .M14_Win_members
{
color:white;
font-size:11px;
font-weight:bold;
width:250px;
height: 43px;
cursor:pointer;
}
.M14_Win_User:hover , .M14_Win_groups:hover ,.M14_Win_members:hover
{
background:#333333 !important;
}
.M14_Win_user_Prof #fa_menulist li:hover
{
background:#222 !important;
}
.M14_Win_user_Prof
{
top: 30px;
margin-left:5px;
width:230px;
height:auto;
padding:5px;
position:absolute;
}
.M14_Win_user_Prof .fa_separator{display:none !important;}
.M14_Win_user_Prof #fa_menulist li
{
float:left !important;
width:230px !important;
height:22px !important;
cursor:pointer !important;
}
.M14_Win_user_Prof a ,#M14_logout ,#M14_logout a#logout , .M14_Win_groups a, .M14_Win_members a ,
#M14_logout a#logout:hover ,.M14_Win_user_Prof #fa_menulist li a ,
#M14_Win_Cont_two #fa_usermenu a#fa_ranktitle ,.M14_Milouze a
{
font-size:11px !important;
color:white !important;
text-decoration:none !important;
}
#M14_Win_Cont_two
{
position:absolute;
bottom:5px;
width:250px;
height:150px;
}
#M14_Win_Cont_two #fa_usermenu{background:white !important;margin-left:50px !important;border:2px solid black !important;}
.M14_Win_user_Prof #fa_usermenu ,#M14_Win_Cont_two #fa_usermenu table{display:none;}
.M14_Win_user_Prof #fa_menulist li a , .M14_Win_groups a ,.M14_Win_members a
{margin-left:5px; !important;}
.M14_Win_user_Prof #fa_menulist
{
display:block;
width:220px !important;
height:200px !important;
left:5px !important;
padding-left:0px !important;
background:#333333 !important;
border:1px solid grey !important;
line-height: 20px !important;
}
.M14_Win_Logo
{
cursor:pointer;
width:43px;
height:34px;
}
.M14_Win_Search
{
position:absolute;
margin: -35px 0px 0px 45px;
height:40px;
width:200px;
}
#M14_Windows #fa_search #fa_textarea
{
color:white !important;
height:40px !important;
border-radius:0px !important;
border-left:1px dotted black;
border-right:1px dotted black;
background:transparent ;
}
/*Placement des boutons*/
.M14_btn_Window_close
{
bottom:0px !important;
}
#M14_Win_Mp ,#M14_Win_avatar ,#M14_Win_Sign ,.M14_Win_Google ,.M14_Milouze ,.M14_btn_Window , .M14_btn_Window_close
{
position: absolute;
height: 40px;
margin-top: 50px;
width:32px;
height:32px;
cursor:pointer;
}
#M14_Win_Mp{left: 22%;}
#M14_Win_avatar{left: 27%;}
#M14_Win_Sign{left: 32%;}
.M14_Win_Google{left: 80%;}
.M14_Milouze{left: 85%;}
.M14_btn_Window,.M14_btn_Window_close{left: 90%;}
.M14_Milouze ,.M14_Win_Google,#M14_Win_Mp,#M14_Win_avatar ,#M14_Win_Sign ,.M14_btn_Window,.M14_btn_Window_close
{border-bottom:2px solid white;}
.M14_Milouze:hover ,.M14_Win_Google:hover ,#M14_Win_Mp:hover ,#M14_Win_avatar:hover ,
#M14_Win_Sign:hover ,.M14_btn_Window:hover{border-bottom:2px solid purple;}
#M14_hour
{
position: absolute;
left: 95%;
height: 40px;
margin-top: -25px;
color: white;
font-size: 11px;
}
/*Fin de la barre des taches facon Windows 10 par Milouze14*/
J'ai volontairement placé un lien vers ce forum, merci de respecter le travail effectué les ami(e)s.
Ensuite vous pouvez changer les liens des boutons à votre guise .
Voila, c'est tout pour le moment

Un soucis direction l'entraide

https://www.milouze14.com/f14-entraide-forumactif
Dernière édition par Milouze14 le Ven 23 Oct 2020 - 8:22, édité 12 fois
Quad Daniel aime ce message
- patriciadpt30Milouzien
Merci beaucoup !
- Grande013Milouzien
Merci beaucoup !

je viens de corriger l'astuce concernant le panneau au clic sur le Pseudo du membre, celui-ci restait ouvert à la fermeture de la barre des tâches.
De plus la barre des tâches pourra quand elle est réduite être de nouveau ouverte à l'aide d'un nouveau bouton

NOUVELLE BARRE DE NAVIGATION
Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).

afin de permettre de ne plus avoir à la réouverture de la barre des tâches un soucis de clic sur le membre en question

En espérant que ce soit la dernière mise à jour

NOUVELLE BARRE DE NAVIGATION
Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
- InvitéInvité
Merci beaucoup !
- safraniteMilouzien
Merci beaucoup !
Sans doute faudrait-il updater les liens pour les passer en HTTPS ?@Milouze14 a écrit:En espérant que ce soit la dernière mise à jour![]()
- Code:
<!-- BEGIN switch_user_logged_in -->
<div id="M14_Windows"style="display:none;">
<div class="M14_Win_cont"style="display:none;">
<div id="M14_Win_Cont_one">
<div class="M14_Win_User"title="Voir mon profil">
<img src="http://i18.servimg.com/u/f18/11/26/21/37/contac11.png"alt="User"align="absmiddle"/><span class="USERNAME">
</span>
Hello Fred,
merci pour ta remontée, je viens d'éditer l'astuce
merci pour ta remontée, je viens d'éditer l'astuce

NOUVELLE BARRE DE NAVIGATION
Le respect mutuel est le fondement de la véritable harmonie.(Dalaï Lama).
Sujets similaires internes ( 0 )
Aucun sujet
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