Question

Here is my working code to collapse fieldsets and scroll to their anchor smoothly, but sometimes there is a jump before scroll, what isn’t really smooth.

function smoothScrollTo(element) {
    var thisTop = $($(element).parent()).offset().top;
    $("html, body").animate({
        scrollTop: thisTop + "px"
    }, {
        duration: 600
    });
    return false;
};

$(document).ready(function () {
    $(".collapsible .collapsed").hide();
    $(".collapsible legend").html(function () {
        var scroll = $(this).parent().hasClass('scroll');
        if (scroll == true) {
            href = "#" + $(this).parent().attr('id');
        } else {
            href = "javascript:void(0)";
        };
        return '<a href="' + href + '">' + $(this).html() + '</a>';
    }).click(function () {
        $(this).parent().children('.content').slideToggle();
    });
    $(".collapsible.scroll legend").click(function () {
        smoothScrollTo(this);
    });

});

---

I found the solution: e.preventDefault(); needed to scroll perfectly

the final code: http://jsfiddle.net/eapo/v6URL/2/

Answer 1

http://jsfiddle.net/v6URL/1/

$(".collapsible.scroll legend").click(function (e) {
    e.preventDefault();
    smoothScrollTo(this);
});