Enable Checkbox After Scrolling to Bottom

Enable Checkbox After Scrolling to Bottom

by Nirvanachain

HTML

<form name="form22">
  <p> License Agreement:<br />
    <div id="terms">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In augue turpis, sollicitudin a porta blandit, malesuada non risus. Fusce vitae mattis ante. Aliquam at tellus ipsum. Pellentesque auctor risus vel purus blandit ac laoreet metus convallis. Nulla quis sapien quis urna luctus fermentum feugiat nec mi. Vestibulum eu nunc tellus. Aliquam vel erat eget arcu lobortis congue vel non metus. Phasellus quis lorem quis mauris sodales malesuada.

Integer eget ligula vel urna tincidunt sollicitudin sed quis felis. Vivamus ac mauris non metus ullamcorper pretium. Donec mollis lacinia pharetra. Quisque at libero elit, semper rhoncus mi. In hac habitasse platea dictumst. Vivamus nulla ipsum, lacinia in tristique at, molestie at elit. Nullam non felis ac tortor facilisis commodo nec sit amet orci. Sed et lacus bibendum risus venenatis iaculis ac eget metus. Cras sed purus in arcu tempus placerat. Integer ante neque, volutpat id auctor tempor, varius consequat nunc. Sed venenatis, purus sit amet viverra bibendum, arcu turpis sollicitudin lorem, non vestibulum justo lacus id erat. Etiam in consectetur turpis.

Proin viverra facilisis turpis sed euismod. Nullam eu ante sit amet eros aliquet ullamcorper. Morbi ligula magna, condimentum vitae egestas vel, vehicula ac elit. Phasellus pharetra turpis et orci semper eu porta libero consequat. Morbi sagittis tincidunt convallis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam lacinia sapien id neque scelerisque rhoncus blandit erat auctor. Curabitur rutrum risus quis sem ornare ornare. Morbi non nisi tempus quam sagittis mollis. Sed eget justo turpis, et egestas diam. Curabitur dolor nisi, sodales nec ultricies molestie, porttitor non nisi. Nunc aliquam, eros id auctor feugiat, sapien augue laoreet mi, nec semper felis metus eu ligula. Mauris tempor dolor tortor, in dapibus sapien.

Nulla dictum sem ac leo dignissim eleifend. Aliquam sollicitudin...

CSS

#terms {
    height: 160px;
    width: 500px;
    overflow: auto;
}

JavaScript

$(document).ready(function(){
    $('#agree').attr('disabled', 'disabled');
    
    $('#terms').scroll(function(){
        var div_height = $(this)[0].scrollHeight;
        var scroll_height = div_height - $(this).innerHeight();
        
        var scroll_top = $(this).scrollTop();
        
        if (scroll_top == scroll_height) {
            $('#agree').removeAttr('disabled');
        }
    });
});