Callback isn't called after first time

[justingolden21]

I have the code:

$('#color-picker').colorPicker({opacity:false, renderCallback: 
    function(elm, toggled) {
        $('#hsl-input').val(elm.val() );
        console.log('callback called');
    }
});

When I drag to change the color picker, the callback function is called (many times). However, when I click on another input then click back on the color picker again, dragging it does not call the callback function.

I've checked the docs and other issues a bit and couldn't find anything on this. Thank you in advance.

EDIT: Here is my HTML for the color picker:

<input id="color-picker" class="form-control" value="hsl(0,0,0)" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">