Chatbox : modifier la hauteur sans la figer

[WolfCyr]

Bonjour,
Je souhaiterai modifier la hauteur de la chatbox pour la réduire à 150 px :

Code:

#chatbox_top, #chatbox_bottom {height:150px !important;}

Le soucis est que le !important est obligatoire, mais on ne peut plus modifier la hauteur de la chatbox avec le slider en bas à droite.
Y'a t'il une technique autre pour donner une hauteur de 150px à l'affichage de la page mais modifiable par l'utilisateur ?

Autre question :
Si on ne peut pas, est-il possible de supprimer le slider en bas en droite (pas seulement l'image, mais tout le div pour ne pas laisser d'espace vide) ?

Merci !!!

[Invité]

Hello WolfCyr,

la hauteur est déjà renseignée dans la css de base, voilà pourquoi il faut le hack important.
Le soucis qui de pose ensuite et que par la css on peu mettre un min-height et la logique veut que l'on mettre le height à auto avec le hack important.
Mais là on ne pourra pas obtenir ce que l'on souhaite.

Je t'ai concocté un script(ou tu pourras changer le lien des images + et - ainsi que la hauteur minimale et maximale de cette dernière).


Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Codes Javascript

Mets un titre explicite.
Coches sur l'index


Déposes ceci:

Code:


$(function(){
//HAUTEUR SOUHAITEE
var hauteurmini='150px';
//HAUTEUR MAXIMALE
var hauteurmaxi='400px';
//LIEN DE L IMAGE PLUS
var imageplus='https://i87.servimg.com/u/f87/11/26/21/37/add11.png';
//LIEN DE L IMAGE MOINS
var imagemoins='https://i87.servimg.com/u/f87/11/26/21/37/minus10.png';
$('#chatbox_top, #chatbox_bottom').each(function(){
  $(this).closest('table').before('<table width="100%"><tr><td align="right"><img src="'+imageplus+'"class="M14_chatboxOpen"title="Augmenter la hauteur"style="cursor:pointer;"/><img src="'+imagemoins+'"class="M14_chatboxClose"title="Diminuer la hauteur"style="display:none;cursor:pointer;"/></td></tr></table><br />');
$(this).css('height',hauteurmini);
$('.M14_chatboxOpen').click(function(){
$(this).hide();
$('.M14_chatboxClose').show();
$('#chatbox_top,#chatbox_bottom').animate({height: ''+hauteurmaxi+''});
});
$('.M14_chatboxClose').click(function(){
$(this).hide();
$('.M14_chatboxOpen').show();
$('#chatbox_top,#chatbox_bottom').animate({height: ''+hauteurmini+''});
});
 
});
});




Penses a cliquer sur le bouton VALIDER



a++

[WolfCyr]

Salut,
avec ce code la hauteur par défaut de 150 px fonctionne bien, sans bloquer le slider. Y'aurai-t-il moyen du coup de supprimer + et - qui ne servent plus à rien ?
Merci beaucoup pour ton temps Milouze14 !

PS :

J'en suis à ça comme code restant :

Code:

$(function(){
//HAUTEUR SOUHAITEE
var hauteurmini='150px';
//HAUTEUR MAXIMALE
var hauteurmaxi='400px';
$('#chatbox_top, #chatbox_bottom').each(function(){
$(this).css('height',hauteurmini);
$('.M14_chatboxOpen').click(function(){
$(this).hide();
$('.M14_chatboxClose').show();
$('#chatbox_top,#chatbox_bottom').animate({height: ''+hauteurmaxi+''});
});
$('.M14_chatboxClose').click(function(){
$(this).hide();
$('.M14_chatboxOpen').show();
$('#chatbox_top,#chatbox_bottom').animate({height: ''+hauteurmini+''});
});
});
});

Je ne pense pas pouvoir épurer plus. Désolé je ne connai absoluement pas le javascript.

Merci pour tout encore une fois !

[Invité]

Hello WolfCyr,
remplaces le script par celui-ci:

Code:

$(function(){
//HAUTEUR SOUHAITEE
var hauteurmini='150px';
$('#chatbox_top, #chatbox_bottom').each(function(){
$(this).css('height',hauteurmini);
});});

a++

[WolfCyr]

Excellent !