jQuery UI Accordion Scrolling问题

时间:2010-10-06 20:08:18

标签: jquery-ui jquery-ui-accordion

我在jQuery UI Accordion中有一个包含几个长度变化很大的部分的页面。如果我打开一个新的部分(折叠上面一个较长的部分),我就会离开页面的底部。因为这些部分的高度明显不同,所以我不能使用自动高度功能而不会看起来很奇怪。有没有办法使用像scrollto这样的东西自动转到我刚刚扩展的部分的顶部?

1 个答案:

答案 0 :(得分:2)

您可以将函数绑定到accordionchange事件并使用jQuery scrollTop()

<强>的JavaScript

$(function () {
    $("#accordion").accordion({
        autoHeight: false,
        header: "h3"
    });

    $('#accordion').bind('accordionchange', function (event, ui) {
        $(window).scrollTop(ui.newHeader.offset().top);
    });
});

<强> HTML

<div id="accordion">
    <div id="accordion-one">
        <h3><a href="#">First</a></h3>
        <div>Some lengthy text</div>
    </div>
    <div id="accordion-two">
        <h3><a href="#">Second</a></h3>
        <div>Less lengthy text</div>
    </div>
    <div id="accordion-three">
        <h3><a href="#">Third</a></h3>
        <div>Other text</div>
    </div>
</div>

我在FF8中对此进行了测试。

<强>链接