<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript">
window.addEvent('domready', function(){
counter = 1;
lineheight = 40;
moderno = new Fx.Scroll($('moderno'));
function goDown() { moderno.scrollTo(0, counter*lineheight); counter++; }
$('goDown').addEvent('click', function(e) {
var e = new Event(e).stop();
goDown();
});
// This is the basic thing to get you going. You'll need to expand somewhat for it to be properly working though
});
</script>
<link href="css/main.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="css/slimbox.css" type="text/css" media="screen" />
<title>Angela Wilson</title>
</head>
<body>
<div id="moderno" style="height: 40px; width: 80px; overflow: hidden; border: 1px dotted Fuchsia;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam et ipsum dignissim odio scelerisque faucibus. Etiam porttitor, pede pretium varius auctor, magna erat iaculis neque, quis suscipit justo ligula eu arcu. Integer eget diam sit amet ipsum luctus volutpat. Nulla ac velit. Etiam massa purus, varius id, sagittis ut, congue a, enim. Pellentesque non quam. Curabitur lacus sem, bibendum gravida, rhoncus sit amet, rutrum sagittis, eros. In hac habitasse platea dictumst. Aenean non neque. In volutpat. Vestibulum faucibus, massa ut accumsan ullamcorper, mauris magna mattis odio, at ullamcorper enim tortor porttitor nibh. Duis vulputate fermentum dolor. Etiam risus arcu, vehicula ut, lobortis convallis, accumsan eu, ante. Aenean et diam at tortor ultricies aliquet. Curabitur dolor enim, ultrices in, mattis eu, pretium nec, ante. Sed mollis.</p>
</div>
<a href="#" id="goDown">DOWN</a>
</body>
</html>