Scroll dow

pege
Javascript

Bonjour, je suis entrain de créé un petit chat sur mon espace membre, mais je suis un peu coincé sur quelque chose que j'aimerais bien réalisé en js. Donc voici mon code html:

<h2 class="header"><?= $user->nom; ?></h2>

<div class="messages-box"></div>

<div class="bottom">
    <div class="field field-area">
        <label for="message" class="field-label">Votre message</label>
        <textarea name="message" id="message" rows="2" class="field-input field-textarea"></textarea>
    </div>
    <button type="submit" id="send" class="send">
        <span class="i-send"></span>
    </button>
</div>

Ce que j'aimerais bien faire est que quand je charge la page ou que quand je reçois un message ma div scroll jusque en bas et que l'utilisateur ne doivent pas aller jusque tt en bas!

Si quelqu'un pourrait m'aider ca serait sympa! Merci d'avance!!

6 réponses

MrCastor

Salut,
Un petit scrollTop ? https://api.jquery.com/scrollTop/

betaWeb

Salut,

Essaye ceci (jQuery):

var $message = $('#message');
$('html, body').animate({ scrollTop: $message.offset().top + $message.height() }, 1000);

C'est basique, il te faudra peaufiner un peu

Julienng

Sans jquery ça donne ceci: 


var objDiv = document.getElementById("your_div");
objDiv.scrollTop = objDiv.scrollHeight;
pege
Auteur

@bataweb, que veut dire le 1000 a la fin de ton script?

Lartak

Bonjour.

@bataweb, que veut dire le 1000 a la fin de ton script?

Tu as la réponse ici même.
Faites un minimum de recherche quand vous ne savez pas, au lieu de poser ce genre de question.

betaWeb

@Lartak +1
@prostario Je pense que tu devrais prendre la peine de chercher un peu par toi-même. Je t'invite donc à lire ce billet http://www.grafikart.fr/blog/debug-how-to/ pour commencer.