[PHPBB2] Afficher le Queel dans un footer semi masqué

 ,

comment avoir un Queel en parti caché en bas de page en ne laissant apparaitre qu'une infime partie  .
un peu comme sur ce forum, sauf qu'il a été modifié quelque peu  .

Il n'y aura pas d'entraide sur l'affichage du Queel de ce forum,
à vous d'avoir de l'imagination les ami(e)s.

La manipulation est assez simple a effectuer ,
il faut juste pour celles et ceux qui n'ont pas toucher à l'apparence du Queel
il faudra voir avec l'image du fond des titres :


Affichage/Images et couleurs/Gestion des images/Mode avançé

   Général / navigation

Afin de voir la hauteur de l'image afin de laisser apparaitre que celle ci  .


Je prend l'exemple de ce forum ,
L'image de fond est celle ci :


Ces dimensions sont 50px par 32px

Ce qui nous intéresse , c'est sa hauteur donc 32px .

En fait , on indiquera dans la CSS une hauteur pour le Queel puis on demandera de ne laisser que l'image
du fond des titres.

Si je veux que mon Queel est une hauteur de 300px
Ma css indiquera -268px

Allez c'est parti :

Dans le template index_body:
Affichage/Templates/Général/index_body



Recherchez ceci:

Code:


<!-- BEGIN disable_viewonline -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">


Attention c'est assez compliqué  

Remplacez par ceci:

Code:


<!-- BEGIN disable_viewonline -->
<table id="M14_footer"class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">


Pensez à enregistrer puis à valider en cliquant respectivement sur    puis

  c'est pas facile tous les jours  .

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

Code:


/* le queel*/
#M14_footer
{
position:fixed ;
left:0 !important;/*on demande un affichage sur toute la largeur du forum*/
bottom:-268px ;/* en relation avec l image du fond des titres*/
height:300px ;/*la hauteur du queel*/
cursor:pointer;
/*l opacite pour laisser l arriere plan*/
-moz-opacity:0.5;
-khtml-opacity:0.5;
-ms-filter:"alpha(opacity=50)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
filter:alpha(opacity=50);
opacity:0.5;
zoom: 1;/* HACK POUR IE */
/*les transitions*/
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
/*Le queel au survol*/
#M14_footer:hover
{
background:#141414;/*la couleur de fond*/
/*on supprime l opacite*/
-moz-opacity:1;
-khtml-opacity:1;
-ms-filter:"alpha(opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter:alpha(opacity=100);
opacity:1;
zoom: 1;/* HACK POUR IE */
bottom:0;/*on le place a 0 px du bord au survol*/
}




Pensez à valider les modifications en cliquant sur le bouton  

Merci

Merci, je suis curieux ...

je suis curieux

merci

Merci

Merci

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci beaucoup

Merci beaucoup !

Merci beaucoup !

Merci beaucoup !

Merci bien !

Merci beaucoup pour ce magnifique partage et pour toutes ces superbes nouveautés pour améliorer et donner un cachet personnaliser à nos fofo. !

Je vais voir ce que va donne.

Amicalement,

Merci beaucoup !

Merci beaucoup !