lrossy/gist:18219f64c1855e2b6b12

## gistfile1.txt
<!DOCTYPE html>
<html>
<head>
  <title>Nanoscroll</title>

  <style>
    .nano { background: #bba; width: 500px; height: 300px; }
    .nano .nano-content { padding: 10px; }
    .nano .nano-pane   { background: #888; }
    .nano .nano-slider { background: #111; }
    .nano-content {
      overflow      : auto;
      height:290px
    }
  </style>
</head>
<body>

<div id="about" class="nano">
  <div class="nano-content">
    <div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div>
  </div>
</div>

<div id="addcontent">add content</div>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src='jquery.nanoscroller.min.js' type="text/javascript"></script>

<script>
  var i = 0;
  $(function() {
    $(".nano").nanoScroller();
  $('#addcontent').click(function(){
    i++;
    $('.nano-content').append('<div>testing' + i + '</div>');
    $(".nano").nanoScroller({scroll: 'bottom'});
  })
  });


</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Nanoscroll</title>

	<style>
	.nano { background: #bba; width: 500px; height: 300px; }
	.nano .nano-content { padding: 10px; }
	.nano .nano-pane { background: #888; }
	.nano .nano-slider { background: #111; }
	.nano-content {
	overflow : auto;
	height:290px
	}
	</style>
	</head>
	<body>

	<div id="about" class="nano">
	<div class="nano-content">
	<div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div><div>testing</div>
	</div>
	</div>

	<div id="addcontent">add content</div>

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
	<script src='jquery.nanoscroller.min.js' type="text/javascript"></script>

	<script>
	var i = 0;
	$(function() {
	$(".nano").nanoScroller();
	$('#addcontent').click(function(){
	i++;
	$('.nano-content').append('<div>testing' + i + '</div>');
	$(".nano").nanoScroller({scroll: 'bottom'});
	})
	});


	</script>
	</body>
	</html>