runyugin,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
.content.fixed {
position: fixed;
bottom: 10px; /*здесь указываем отступ сверху*/
left:510px;
z-index: 9999; /*устанавливаем блок поверх всех элементов на странице*/
}
.coln-left{
position: absolute;
left: 0px;
width: 100px;
height: 1500px;
background: #009933;
border-bottom: #CC33CC 5px solid;
}
.content{
position: absolute;
left: 510px;
width: 100px;
height: 1200px;
background: #3399FF;
border-bottom: #CC33CC 5px solid;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function(){
var topPos = $('.content').offset().top + $('.content').height(); //topPos - это значение от верха блока до окна браузера
$(window).scroll(function() {
var top = $(this).scrollTop()+ $(this).height();
if (top > topPos) $('.content').addClass('fixed');
else $('.content').removeClass('fixed');
});
});
</script>
</head>
<body>
<div class="wrapper clearfix">
<!-- Coln-left -->
<div class="coln-left">
</div>
<!-- Coln-left #END /-->
<!-- Content -->
<div class="content">
</div>
<!-- Content #END /-->
</div>
</body>
</html>