Как фиксировать заголовок сверху, пока видна секция

function fixTitle() {
    $('section.affix').each(function () {
        var $this = $(this);
        var offset = $this.offset().top;
        var scrollTop = $(window).scrollTop();

        if (scrollTop > offset) {
            $this.addClass('fixed');
        } else {
            $this.removeClass('fixed');
        }
    });
}

$(document).ready(function () {
    $(window).scroll(fixTitle);
});

section {
    overflow:hidden;
    padding:0 20%;
    position:relative;
}
section h1 {
    float:left;
    width:17%;
    background:#fff;
}
section .summary {
    float:right;
    width:70%;
}
.fixed h1:first-child {
    position:fixed;
    top:0;
}

<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
<section class="affix">
     <h1>Title 1</h1>

    <div class="summary">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris in justo lectus. Praesent suscipit lacus malesuada, lacinia libero sit amet, placerat justo. Praesent aliquam dignissim tellus quis feugiat. Aenean ac varius nulla. Suspendisse nec mauris ac ligula tempor pharetra ut ac massa. Aenean lacinia consectetur facilisis. Proin eget velit mi. Duis metus risus, viverra ac lacus eu, vestibulum condimentum diam. Fusce molestie nulla felis, sit amet volutpat enim elementum vel. Praesent libero augue, scelerisque in lacus eget, malesuada vestibulum tellus. Curabitur vel nisi enim. In congue, urna vel rhoncus accumsan, velit neque ultrices diam, at dapibus erat ante et augue. Etiam enim tellus, accumsan a velit id, mollis tincidunt augue. Morbi ullamcorper ipsum feugiat vestibulum egestas. Proin porta lacus id sollicitudin vulputate. Nullam tristique neque ac velit lacinia, ut suscipit ligula accumsan.</p>
        <p>Aliquam porttitor id erat et tempus. Aliquam interdum quis lacus ac mollis. Nullam sit amet rutrum leo, vitae fringilla quam. Praesent at lacus et est cursus dictum sed ut elit. Suspendisse sed hendrerit arcu, vel consequat tellus. Cras in tellus commodo, ultricies velit ac, euismod dolor. Donec sollicitudin nisi sit amet augue porta interdum. Vestibulum pulvinar, nisl vel condimentum auctor, nisl dolor laoreet lorem, eget laoreet nunc eros a velit. Cras fermentum ipsum id posuere dignissim.</p>
        <p>Donec vehicula justo sit amet dui euismod dapibus. Sed nulla lacus, lacinia id placerat at, eleifend id libero. Nam gravida neque eu tellus euismod, a consectetur ante interdum. In hac habitasse platea dictumst. In hac habitasse platea dictumst. Sed ut felis at orci tristique mollis. Donec quis tristique urna. Nunc vitae tristique quam. Cras non urna molestie, aliquam nunc sit amet, venenatis dolor.</p>
        <p>Donec nisi enim, lacinia id molestie non, pharetra vel sapien. Duis egestas fringilla ipsum eget iaculis. Integer ultrices accumsan nunc, eget viverra lectus congue eget. Etiam pharetra dolor eget neque accumsan, vel vestibulum ante condimentum. Duis a risus ac turpis mattis mollis vel vitae libero. Proin viverra lectus ut interdum elementum. Nulla ornare ante lobortis purus faucibus iaculis. Duis tempus pharetra tristique.</p>
        <p>In imperdiet ligula eget ligula interdum, eget dictum felis porta. Quisque eu tellus non mi dignissim aliquet. Suspendisse mollis lobortis quam, eu ultrices lectus bibendum eu. Sed at urna nec arcu vulputate lobortis. Sed quis semper ante. Morbi tincidunt felis risus, sed venenatis massa pharetra id. Praesent aliquam scelerisque interdum. Proin libero mi, accumsan lobortis semper vel, tincidunt at nisl. Aliquam erat volutpat.</p>
    </div>
</section>
<section class="affix">
     <h1>Title 2</h1>

    <div class="summary">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris in justo lectus. Praesent suscipit lacus malesuada, lacinia libero sit amet, placerat justo. Praesent aliquam dignissim tellus quis feugiat. Aenean ac varius nulla. Suspendisse nec mauris ac ligula tempor pharetra ut ac massa. Aenean lacinia consectetur facilisis. Proin eget velit mi. Duis metus risus, viverra ac lacus eu, vestibulum condimentum diam. Fusce molestie nulla felis, sit amet volutpat enim elementum vel. Praesent libero augue, scelerisque in lacus eget, malesuada vestibulum tellus. Curabitur vel nisi enim. In congue, urna vel rhoncus accumsan, velit neque ultrices diam, at dapibus erat ante et augue. Etiam enim tellus, accumsan a velit id, mollis tincidunt augue. Morbi ullamcorper ipsum feugiat vestibulum egestas. Proin porta lacus id sollicitudin vulputate. Nullam tristique neque ac velit lacinia, ut suscipit ligula accumsan.</p>
        <p>Aliquam porttitor id erat et tempus. Aliquam interdum quis lacus ac mollis. Nullam sit amet rutrum leo, vitae fringilla quam. Praesent at lacus et est cursus dictum sed ut elit. Suspendisse sed hendrerit arcu, vel consequat tellus. Cras in tellus commodo, ultricies velit ac, euismod dolor. Donec sollicitudin nisi sit amet augue porta interdum. Vestibulum pulvinar, nisl vel condimentum auctor, nisl dolor laoreet lorem, eget laoreet nunc eros a velit. Cras fermentum ipsum id posuere dignissim.</p>
        <p>Donec vehicula justo sit amet dui euismod dapibus. Sed nulla lacus, lacinia id placerat at, eleifend id libero. Nam gravida neque eu tellus euismod, a consectetur ante interdum. In hac habitasse platea dictumst. In hac habitasse platea dictumst. Sed ut felis at orci tristique mollis. Donec quis tristique urna. Nunc vitae tristique quam. Cras non urna molestie, aliquam nunc sit amet, venenatis dolor.</p>
        <p>Donec nisi enim, lacinia id molestie non, pharetra vel sapien. Duis egestas fringilla ipsum eget iaculis. Integer ultrices accumsan nunc, eget viverra lectus congue eget. Etiam pharetra dolor eget neque accumsan, vel vestibulum ante condimentum. Duis a risus ac turpis mattis mollis vel vitae libero. Proin viverra lectus ut interdum elementum. Nulla ornare ante lobortis purus faucibus iaculis. Duis tempus pharetra tristique.</p>
        <p>In imperdiet ligula eget ligula interdum, eget dictum felis porta. Quisque eu tellus non mi dignissim aliquet. Suspendisse mollis lobortis quam, eu ultrices lectus bibendum eu. Sed at urna nec arcu vulputate lobortis. Sed quis semper ante. Morbi tincidunt felis risus, sed venenatis massa pharetra id. Praesent aliquam scelerisque interdum. Proin libero mi, accumsan lobortis semper vel, tincidunt at nisl. Aliquam erat volutpat.</p>
    </div>
</section>
<section class="affix">
     <h1>Title 3</h1>

    <div class="summary">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris in justo lectus. Praesent suscipit lacus malesuada, lacinia libero sit amet, placerat justo. Praesent aliquam dignissim tellus quis feugiat. Aenean ac varius nulla. Suspendisse nec mauris ac ligula tempor pharetra ut ac massa. Aenean lacinia consectetur facilisis. Proin eget velit mi. Duis metus risus, viverra ac lacus eu, vestibulum condimentum diam. Fusce molestie nulla felis, sit amet volutpat enim elementum vel. Praesent libero augue, scelerisque in lacus eget, malesuada vestibulum tellus. Curabitur vel nisi enim. In congue, urna vel rhoncus accumsan, velit neque ultrices diam, at dapibus erat ante et augue. Etiam enim tellus, accumsan a velit id, mollis tincidunt augue. Morbi ullamcorper ipsum feugiat vestibulum egestas. Proin porta lacus id sollicitudin vulputate. Nullam tristique neque ac velit lacinia, ut suscipit ligula accumsan.</p>
        <p>Aliquam porttitor id erat et tempus. Aliquam interdum quis lacus ac mollis. Nullam sit amet rutrum leo, vitae fringilla quam. Praesent at lacus et est cursus dictum sed ut elit. Suspendisse sed hendrerit arcu, vel consequat tellus. Cras in tellus commodo, ultricies velit ac, euismod dolor. Donec sollicitudin nisi sit amet augue porta interdum. Vestibulum pulvinar, nisl vel condimentum auctor, nisl dolor laoreet lorem, eget laoreet nunc eros a velit. Cras fermentum ipsum id posuere dignissim.</p>
        <p>Donec vehicula justo sit amet dui euismod dapibus. Sed nulla lacus, lacinia id placerat at, eleifend id libero. Nam gravida neque eu tellus euismod, a consectetur ante interdum. In hac habitasse platea dictumst. In hac habitasse platea dictumst. Sed ut felis at orci tristique mollis. Donec quis tristique urna. Nunc vitae tristique quam. Cras non urna molestie, aliquam nunc sit amet, venenatis dolor.</p>
        <p>Donec nisi enim, lacinia id molestie non, pharetra vel sapien. Duis egestas fringilla ipsum eget iaculis. Integer ultrices accumsan nunc, eget viverra lectus congue eget. Etiam pharetra dolor eget neque accumsan, vel vestibulum ante condimentum. Duis a risus ac turpis mattis mollis vel vitae libero. Proin viverra lectus ut interdum elementum. Nulla ornare ante lobortis purus faucibus iaculis. Duis tempus pharetra tristique.</p>
        <p>In imperdiet ligula eget ligula interdum, eget dictum felis porta. Quisque eu tellus non mi dignissim aliquet. Suspendisse mollis lobortis quam, eu ultrices lectus bibendum eu. Sed at urna nec arcu vulputate lobortis. Sed quis semper ante. Morbi tincidunt felis risus, sed venenatis massa pharetra id. Praesent aliquam scelerisque interdum. Proin libero mi, accumsan lobortis semper vel, tincidunt at nisl. Aliquam erat volutpat.</p>
    </div>
</section>