moo tool scroll

by ryanwfiorini

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css">
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Test</title>
  </head>

  <body>
  
    <header>
        <div class="header-wrap rc6" id="top">
                <table id="header-cnt">
                    <tbody>
                        <tr>
                            <td>
                                1
                            </td>
                            
                            <td>
                                2
                            </td>
                        </tr>
                    </tbody>
                </table>
        </div>
        
        
    </header>
        
    <div class="topbar-wrapper" data-behavior="BS.Dropdown">
        <div id="topbar" class="topbar" data-behavior="BS.Dropdown" style="display:none;">
          <div class="minimize"><a href="javascript:;" id="topbarToggler" class="p btn" data-mode="0">+</a></div>
        </div>
        <div id="bottombar" style="opacity:0;"><a href="javascript:;" id="gototop" onclick="void(0);new Fx.Scroll(window).toElement('top','y')">Go top</a></div>
    </div>    
        
    <div id="contentContainer" class="container">
      <div id="contentWrap" class="content rc6">
        <div id="page_heading" class="page-header" style="padding:4px 20px 10px;margin:-20px -20px 0px!important;">
            <h1>Heading</h1>
        </div>
        <div class="row">
                <div class="span10">
                  <table id="contentWrap" class="rc4" style="width:940px;">
                        <tbody>
                            <tr>
                                <td>
                                    <p>
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dolor tellus, luctus sit amet bibendum ultricies, placerat non mauris. Suspendisse potenti. Nullam consectetur orci quis felis ultricies congue. Vivamus...

CSS

html, body {background-color:#eee;}
            body {padding-top:0;}

            input[type=password] {overflow:auto;}
            input.authInput:focus {color:#444;}

            h1 {font:30px sans-serif;font-weight:bold;margin-bottom:0px!important;}
            h1 img{vertical-align:middle;position:relative;top:-4px;right:4px;}
            h2 {font:24px sans-serif;font-weight:normal;}
            h3 {font:17px sans-serif;font-weight:normal;}
            span.sup {vertical-align:baseline;font-size:0.8em;position:relative;top:-0.4em;}


            .center{text-align:center;}
            .container > footer p {text-align: center;}
            .container {}
            .content {background-color:#fff;padding:20px;margin:0 -20px;-webkit-border-radius: 0 0 6px 6px;-moz-border-radius: 0 0 6px 6px;border-radius: 0 0 6px 6px;-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);-moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);box-shadow: 0 1px 2px rgba(0,0,0,.15);}

            .page-header {background-color:#f5f5f5;padding:10px 20px 10px;margin:-20px -20px 20px;}
            .content .span10,.content .span4 {min-height: 500px;}
            .content .span4 {margin-left:0;padding-left:19px;border-left:1px solid #eee;}
            .unvisible {visibility:hidden;}

            #topbar {z-index:100;}
            .topbar .btn {border: 0;}
            .topbar form {margin-top:13px}
            .topbar h3 a, .topbar .brand {height:28px;}
            .topbar img.logo {height:50px;position:relative;top:-14px;vertical-align:top;}
            .topbar div > ul a, .nav a {padding:18px 10px 10px;}
            #topbar ul.nav li a {outline:medium none!important;}
            #topbar div.minimize {position:absolute;z-index:2;user-select:none;-webkit-user-select:none;-moz-user-select:none;}
            #topbar div.minimize a{outline:medium none;}
            #topbar div.minimize a.p,#topbar div.minimize a.m ...

JavaScript

var rePositionFixedContainer=function(){;
                var sofar=window.getScroll().y,topbar=($("topbar"))?$("topbar"):false,bottombar=($("bottombar"))?$("bottombar"):false;
                if(topbar!=false){
                    if(sofar>350){topbar.setStyles({"display":"block"});}
                    else{topbar.setStyles({"display":"none"});}
                }
                if(bottombar!=false){
                    if(sofar>350){bottombar.fade("in");}
                    else{bottombar.fade("out");}
                }
                if($("filterFixed")){
                    var _top=($("topbarToggler").getAttribute("data-mode").toInt()==1) ? "45px": 0;
                    if(sofar>300){$("filterFixed").setStyle("top",_top);}
                    else{$("filterFixed").setStyle("top","inherit");}
                }
            }
            
            var topbarTogglerAct=function(){
                var toggler=($("topbarToggler")) ? $("topbarToggler") : false,topbar=($("topbarCnt")) ? $("topbarCnt") : false;
                if(toggler!=false&&topbar!=false){
                    
                
                    toggler.addEvent("click",function(){
                        var mode=toggler.getAttribute("data-mode").toInt();
                         if(mode==0){
                            topbar.setStyles({"opacity":1});
                            toggler.setAttribute("data-mode",1);
                            toggler.addClass("m").removeClass("p");
                            toggler.innerHTML="-";
                            if(s){s.setItem("topbar",1);}
                            $("filterFixed").setStyle("top","45px");
                         }
                         else{
                            topbar.setStyles({"opacity":0});
                            toggler.setAttribute("data-mode",0);
                            toggler.addClass("p").removeClass("m");
                            toggler.innerHTML="+";
                           ...