Scrollbar custom
Résolu
dePassage
-
prosthetiks Messages postés 1189 Date d'inscription Statut Membre Dernière intervention -
prosthetiks Messages postés 1189 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je développe un système de messagerie avec le formulaire d'envoie en bas de la conversation (style SMS). Je voudrais donc que la scrollbar reste par défaut en bas pour voir le dernier message affiché. Cela fonctionnait avec le code suivant :
J'ai ensuite voulu rajouter une barre custom avec le script JQuery prévu à cet effet :
La barre est bien customisée comme voulue, mais le scroll ne reste plus en bas par défaut. Je n'arrive pas à lier les deux scripts.
Avez-vous une solution ?
Je vous remercie
Je développe un système de messagerie avec le formulaire d'envoie en bas de la conversation (style SMS). Je voudrais donc que la scrollbar reste par défaut en bas pour voir le dernier message affiché. Cela fonctionnait avec le code suivant :
element = document.getElementById('messages');
element.scrollTop = element.scrollHeight;
J'ai ensuite voulu rajouter une barre custom avec le script JQuery prévu à cet effet :
(function($){
$(window).load(function(){
$("#messages").mCustomScrollbar();
});
})(jQuery);
La barre est bien customisée comme voulue, mais le scroll ne reste plus en bas par défaut. Je n'arrive pas à lier les deux scripts.
Avez-vous une solution ?
Je vous remercie
A voir également:
- Custom words skribbl francais
- Lire le coran en français pdf - Télécharger - Histoire & Religion
- Dernière version ccleaner gratuit français - Télécharger - Nettoyage
- Télécharger adobe reader 9.1 français gratuit - Télécharger - PDF
- Fixwin 11 en français - Télécharger - Divers Utilitaires
- Telechargement film d'action complet en francais - Télécharger - TV & Vidéo
4 réponses
J'ai pas trouvé d'options dans le script pour setter le scroll en bas par défaut, par contre tu peux faire quelque chose dans le style:
Sinon va falloir bidouiller...
<script type="text/javascript">
(function($){
$(window).load(function(){
$("#messages").mCustomScrollbar({
advanced:{
autoScrollOnFocus: true
}
});
$("#messages").mCustomScrollbar("scrollTo","bottom");
});
})(jQuery);
</script>
Sinon va falloir bidouiller...
En HTML, j'ai simplement un <div id="messages"> ... </div> sur lequel porte le scroll.
Ensuite, je place dans le css un "overflow:scroll" sur le div en question, et j'ajoute le js suivant :
et à ce moment là j'ai bien ma scrollbar qui est en bas par défaut, mais qui est moche et grise (la scrollbar d'origine quoi !)
Mais si j'ajoute le custom scrollbar (le script que j'ai posté dans mon premier message), en laissant le "overflow:scroll", la barre custom s'ajoute à la barre d'origine et ne se place pas en bas. Si j'enlève le "overflow:scroll", j'ai bien uniquement la barre custom, mais pas en bas par défaut.
J'espère être clair
EDIT : La scrollbar custom découle du script jquery.mCustomScrollbar.min.js de JQuery
Ensuite, je place dans le css un "overflow:scroll" sur le div en question, et j'ajoute le js suivant :
element = document.getElementById('messages');
element.scrollTop = element.scrollHeight;
et à ce moment là j'ai bien ma scrollbar qui est en bas par défaut, mais qui est moche et grise (la scrollbar d'origine quoi !)
Mais si j'ajoute le custom scrollbar (le script que j'ai posté dans mon premier message), en laissant le "overflow:scroll", la barre custom s'ajoute à la barre d'origine et ne se place pas en bas. Si j'enlève le "overflow:scroll", j'ai bien uniquement la barre custom, mais pas en bas par défaut.
J'espère être clair
EDIT : La scrollbar custom découle du script jquery.mCustomScrollbar.min.js de JQuery