Q:

Jquery scroll to section based on data attribute

I have tried to make these images which when you click on them they scroll to the id given in the data-down attribute. However when I try it it does not scoll. When you do a console log of the variable that contains the id to scroll to it is correct so I don't know why it isn't working.
<header>
    <div id="header-content">
        <h1>Welcome to the JETS Lake Garda Campaign</h1>
        <img class="down" data-down="#about" src="images/down.png">
    </div>
</header>
<section id="about">
    <h2>About Us</h2>
    <p>Libero minus dicta, sapiente, dolor, quidem quisquam magnam expedita eos voluptates saepe itaque maiores facilis sit nihil consequuntur vero hic possimus inventore autem. Voluptate amet dicta corporis dolorum facilis, quisquam.</p>
    <img class="down" data-down="#sailors" src="images/down.png">
</section>
<section id="sailors">
    <h2>Sailors</h2>
    <p>Libero minus dicta, sapiente, dolor, quidem quisquam magnam expedita eos voluptates saepe itaque maiores facilis sit nihil consequuntur vero hic possimus inventore autem. Voluptate amet dicta corporis dolorum facilis, quisquam.</p>
    <div class="down" data-down="#sponsors" src="images/down.png">
</section>
<section id="sponsors">
    <h2>Sponsors</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, itaque, pariatur. Aliquam ab in, ullam nostrum quis eos, commodi at? Eos quod amet dignissimos dolorum consequuntur adipisci dolore ducimus quis.</p>
</section>

$(document).ready(function () {
    $('.down').on('click', function () {
        var toGo = $(this).data('down');
        console.log(toGo);
        $('html,body').animate({
            scrollTop: $(toGo).offset.top
        }, 'slow');
    });
});

http://jsfiddle.net/8bc15bdu/

A:

You have to replace $(toGo).offset.top with $(toGo).offset().top

