How to enable and disable automatic scrolling in a chat?

4

I'm having second thoughts about implementing this feature.

I have a link that does this, type enable and disable automatic scrolling.

For a better understanding, access JSFIDDLE below:

JSFIDDLE EXAMPLE

    
asked by anonymous 14.01.2015 / 14:35

1 answer

4

To do automatic scrolling, you can do the following:

$(document).ready(function(){
    var msg = $("#msg");

    $("#send_msg").click(function(){
        if(msg.val().length >= 1){
            $("#list_msg").append("<li>"+msg.val()+"</li>")
            msg.val("").focus();
        }

       // verifica se o scroll automático está habilitado (atualmente)

        if ($("#list_msg").data('scroll-habilitado') === true) {
              var scrollHeight = $("#list_msg").prop('scrollHeight');
              $("#list_msg").scrollTop(scrollHeight);
        }
    })

    $("#scroll_enable_disable").click(function(){
        var currentStatus = $("#list_msg").data('scroll-habilitado');
       // faz o toggle de status
       $("#list_msg").data('scroll-habilitado', !currentStatus);
    })
})

By default, you can set whether or not it will be enabled, as follows:

<ul id="list_msg" data-scroll-habilitado="true"></ul>

And as an example was requested in JsFiddle , here it goes:

link

    
14.01.2015 / 14:44