Sliding navbar

HTML

<div id="main">test</div>
<div class="main2">test2</div>
<div class="large-div"></div>
<div class="totop"></div>

CSS

.large-div
{
    width:300px;
    height:10000px;
}


.totop {
position:fixed;
bottom:50%;
right:-300px;
width:300px;
height:100px;
font-size:30px;
color:white;
background:#f18500;
}

#main {
  position:fixed;
  font-size: 50px;
}

.main2 {
  position:fixed;
  font-size: 50px;
  margin-top: 50px;
}

JavaScript

jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > 100) {
    jQuery('.totop').stop().animate({ right: '0px' });
    document.getElementById("main").style.marginLeft = "250px";
    jQuery('.main2').stop().animate({ marginLeft: '250px' });
} else {
    jQuery('.totop').stop().animate({ right: '-300px' });
    document.getElementById("main").style.marginLeft = "0px";
    jQuery('.main2').stop().animate({ marginLeft: '0px' });
}
});