Membres connectés récemment
[PUNBB] Limiter la hauteur des messages
5 participants
Page 1 sur 1 • Partagez
,
l'astuce consiste à diminuer la hauteur des messages en version Pun.
Le soucis rencontré lorsque l'on navigue sur les messages on distingue
parfois une hauteur disproportionnée par rapport au message posté.
Ceci étant dû au profil et les dérivés qui s'en suit.
On va donc passer par un javascript qui va attribuer un identifiant et masquer une partie du profil , un bouton placer en haut fera le reste pour afficher tous les messages dans leur totalité .
L'aperçu imagé:
On distingue un scroll sur le message et une partie du profil est caché
puis au clis tout le contenu des messages sera affiché .
Modules/HTML JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur les sujets.
Déposez ce script:
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Déposez ce style:
Pensez a cliquer sur le bouton
l'astuce consiste à diminuer la hauteur des messages en version Pun.
Le soucis rencontré lorsque l'on navigue sur les messages on distingue
parfois une hauteur disproportionnée par rapport au message posté.
Ceci étant dû au profil et les dérivés qui s'en suit.
On va donc passer par un javascript qui va attribuer un identifiant et masquer une partie du profil , un bouton placer en haut fera le reste pour afficher tous les messages dans leur totalité .
L'aperçu imagé:
On distingue un scroll sur le message et une partie du profil est caché
puis au clis tout le contenu des messages sera affiché .
Modules/HTML JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur les sujets.
Déposez ce script:
- Code:
$(function(){
$('.paged-head:first').after('
<div style="width:50%;height:34px;">
<span id="M14_Open_Prof"title="Voir les messages dans leurs totalité"></span>
<span id="M14_Close_Prof"style="display:none;"title="Réduire les messages"></span>
</div>
');
$('.user-info').hide();
$('.postbody .entry-content ').attr('id','M14_Post');
$('#M14_Open_Prof').click(function(){
$(this).fadeOut();
$('#M14_Close_Prof').fadeIn();
$(' .user-info ').slideDown(800);
$('.postbody .entry-content ').removeAttr('id');
});
});
$(function(){
$('#M14_Close_Prof').click(function(){
$(this).fadeOut();
$('#M14_Open_Prof').fadeIn();
$('.user-info ').slideUp(800);
$('.postbody .entry-content ').attr('id','M14_Post');
}); });;
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Déposez ce style:
- Code:
/*On donne une hauteur au messages*/
#M14_Post.entry-content{height:150px ;overflow-y:auto;}
/*Bouton d ouverture*/
#M14_Open_Prof
{
width:32px;/*largeur de l image*/
height:32px;/*hauteur de l image*/
background:url(http://i39.servimg.com/u/f39/11/26/21/37/naviga16.png);
position:absolute;
margin-left:30px;/*on decale de 30px l image de la gauche*/
cursor:pointer;/*on donne un style au curseur*/
}
/*Bouton de fermeture*/
#M14_Close_Prof
{
width:32px;/*largeur de l image*/
height:32px;/*hauteur de l image*/
background:url(http://i39.servimg.com/u/f39/11/26/21/37/naviga15.png);
position:absolute;
margin-left:30px;/*on decale de 30px l image de la gauche*/
cursor:pointer;/*on donne un style au curseur*/
}
Pensez a cliquer sur le bouton
Sujets similaires
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