Question

I have a jQuery scroll set up, but the duration is not working properly.
On a the “About Page” of a WordPress site, I want to use jQuery so that upon click of a photo, it scrolls down to the appropriate div. The scroll is working, however, the duration is not. The scroll takes about 1/4 a second and it doesn’t matter at what speed I set the duration. The site I’m referring can be seen at: http://teamcoding.ca/corporate/about-test/

Below is the source code for the jQuery scroll.

$(function(){
    $('a[href*=.staff_photos_indiv]').click(function() {
        if (location.pathname.replace(/^\//,") == this.pathname.replace(/^\//,") && location.hostname == this.hostname) {
            var $target = $target;
            $target = $(this.hash);
            $target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
            if ($target.length) {
                var targetOffset = $target.offset().top;
                $('html,body').animate({scrollTop: targetOffset}, {easing:'easeInOutExpo',duration:1600});
                return false;
            }
        }
    }); 
});

Answer 1

My guess would be that you don’t have the 'easeInOutExpo' easing function defined because the general operation works with this code:

$(document.body).animate(
    {scrollTop: "400px"}, {easing: "swing", duration: 1600}
);

And, you can see it work here: http://jsfiddle.net/jfriend00/UbnUh/