коллеги доброго времени суток, прошу помощи знатоков, ибо залип над одним моментом. есть список: 
<div class="container">
        <div class="layout">
            <div class="item">
                <div class="header">name</div>
                <ul>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                </ul>
            </div>
            <div class="item">
                <div class="header">name</div>
                <ul>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                    <li>text</li>
                </ul>
            </div>
        </div>
    </div>
при событии wheel происходит смещение layout, тут проблем нету:
_whell_action(e) {
        let direction = -Math.sign(e.deltaY);
        let step = 5 * direction;
        this.layout.style.top = (this.layout.offsetTop + step) + 'px';
        if (this.layout.offsetTop >= 0) this.layout.style.top = '0px';
        if (this.layout.offsetTop <= (this.container.clientHeight - this.list_height)) 
            this.layout.style.top = (this.container.clientHeight - this.list_height) + 'px';
        let header = this.current_item.querySelector('.header');
             header.style.top = (header.offsetTop + step) + 'px';
    }
Но не могу посчитать расстояние, на которое нужно двигать в том же направлении и header внутри item, до тех пор пока не сам header внутри. Определяю текущий item а как определить смещение? прошу помощи, заранее спасибо