Advanced Search

Return to Snippet

Revision: 31197
at September 1, 2010 02:06 by vagrantradio
Updated Code 
<div id="scrollPane" style="height:150px;overflow-y:scroll;">
 <div class="inner">
  Terms of service jargon stuff here
 </div>
</div>
<input name="TERMS_ACCEPTED_YN" type="checkbox" id="TERMS_ACCEPTED_YN" value="Y"><label>I accept the blah, blah, blah.</label>

jQuery(document).ready(function() {
	jQuery("input#TERMS_ACCEPTED_YN").attr("disabled", true);
	
	var $box = $("#scrollPane"),
	$inner = $("> .inner", $box),
	innerOuterHeight = $inner.outerHeight();
	boxHeight = $box.height();
	boxOffsetTop = $box.offset().top;
	
	jQuery("#scrollPane").scroll(function() {
		if (Math.ceil(boxHeight - $inner.offset().top + boxOffsetTop) >= innerOuterHeight ) {
		jQuery("input#TERMS_ACCEPTED_YN").removeAttr("disabled");
	}
 });
});

Revision: 31196
at September 1, 2010 02:05 by vagrantradio
Updated Code 
<div id="scrollPane" style="height:150px;overflow-y:scroll;">
 <div class="inner">
  Terms of service jargon stuff here
 </div>
</div>

jQuery(document).ready(function() {
	jQuery("input#TERMS_ACCEPTED_YN").attr("disabled", true);
	
	var $box = $("#scrollPane"),
	$inner = $("> .inner", $box),
	innerOuterHeight = $inner.outerHeight();
	boxHeight = $box.height();
	boxOffsetTop = $box.offset().top;
	
	jQuery("#scrollPane").scroll(function() {
		if (Math.ceil(boxHeight - $inner.offset().top + boxOffsetTop) >= innerOuterHeight ) {
		jQuery("input#TERMS_ACCEPTED_YN").removeAttr("disabled");
	}
 });
});

Revision: 31195
at September 1, 2010 02:04 by vagrantradio
Initial Code 
<div id="scrollPane" style="height:150px;overflow-y:scroll;">
 <div class="inner">
  Terms of service jargon stuff here
 </div>
</div>

jQuery(document).ready(function() {
	jQuery("input#TERMS_ACCEPTED_YN").attr("disabled", true);
	
	var $box = $("#scrollPane"),
	$inner = $("> .inner", $box),
	innerOuterHeight = $inner.outerHeight();
	boxHeight = $box.height();
	boxOffsetTop = $box.offset().top;
	
	jQuery("#scrollPane").scroll(function() {
		if (Math.ceil(boxHeight - $inner.offset().top + boxOffsetTop) >= innerOuterHeight ) {
		jQuery("input#TERMS_ACCEPTED_YN").removeAttr("disabled");
		}
 });
});
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
This detects if a user has scrolled to the bottom of an overflow div and enables the checkbox. Can be used for terms of service acceptance, etc.

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Div Bottom Scroll Detection

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
jQuery