посчитали высоту страницы (
hp), высоту окна (
hw)
получили максимальный скролл
smax = hp - hw и минимальный
smin = 0
знаем начальный (
hmax) и конечный (
hmin) размеры целевого элемента
получаем текущую величину скролла (
s)
вычисляем диапазоны изменений
ds = smax - smin = smax
dh = hmax - hmin
отсюда вытекает что
s / ds = h / dh , где h - приращение высоты целевого элемента
=>
h = hmax - (dh * s) / ds
Если нужно увеличивать элемент, меняем последнюю формулу
h = (dh * s) / ds + hminИтоговый код (подробный)var element = document.getElementById('d');
var hp = document.body.scrollHeight,
hw = window.innerHeight,
smax = hp - hw,
smin = 0,
hmin = 100,
hmax = 300,
ds = smax - smin,
dh = hmax - hmin;
window.addEventListener('scroll', function () {
var s = window.pageYOffset; // current scrollTop
var h = hmax - (dh * s) / ds;
element.style.height = h + 'px';
});
Сокращенныйvar element = document.getElementById('d');
var hmin = 100,
hmax = 300;
window.addEventListener('scroll', function () {
var s = window.pageYOffset; // current scrollTop
var h = hmax - ((hmax - hmin) * s) / (document.body.scrollHeight - window.innerHeight);
element.style.height = h + 'px';
});
И
демо на фиддле 
