krakoss,
Вариант покороче ...
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
#fix{height:700px;background:#FF3}
#cont{width:200px;height:30px;background:#0C0}
.border{border:#FF3333 3px solid;position: fixed;z-index:100; bottom: 0px}
body{position:relative;height:1000px;background:#DDD}
p{margin:0px}
.win{height:500px}
</style>
<script>
window.onload = window.onscroll = window.onresize = function () {
var a = document.getElementById("cont"),
b = document.getElementById("fix").getBoundingClientRect(),
b = b.top + a.scrollHeight + 6 < document.documentElement.clientHeight && b.bottom + a.scrollHeight + 6 > document.documentElement.clientHeight;
a.classList[b ? "add" : "remove"]("border");
};
</script>
</head>
<body>
<p class="win"></p>
<p id="fix">1<br>2<br></p>
<p id="cont">Итого</p>
<p class="win"></p>
</body>
</html>