Question

jQuery手风琴在加载内容iframe时向左反弹。我很难过。

有什么建议吗？

我猜这是iframe大小调整代码。

$(function() {
    $( "#accordion" ).accordion({
        collapsible: true, 
        active: false
    });
});

Accordion in jsFiddle

Answer 1

不是很酷，但你可以轻松地尝试一下这样的工作：

$(function(){ $('.ui-accordion-header').on('click',function(){
        if($(this).hasClass('ui-state-active')){
         $('body').css('overflow','hidden');
        }else{
        setTimeout(function(){
         $('body').css('overflow','auto');
         },600);
        }
        });
        });

working example here

Answer 2

当出现滚动条时，退回是正常的浏览器行为。在IE 7等旧版浏览器中（我认为），滚动条始终可见，只在不需要时禁用。所以不会发生反弹。

调整溢出

您仍然可以实现这一点并使用overflow属性即使在不需要时也始终可以看到滚动条。

就像旧的浏览器一样，它在不需要时禁用滚动条，并在需要时启用它。因此，没有反弹。

以下CSS会这样做：

body {
    overflow-y: scroll;
}

DEMO 1 - 始终显示滚动条

调整高度

另一个替代方案是使文档高出100％，因此您也始终可以看到滚动条，但它始终处于启用状态。

您可以为此添加以下CSS：

html {
    height: 101%;
}

DEMO 2 - 使用更大的HTML文档

DEMO 1 似乎是更标准的方法，因为它看起来更像是用于浏览的浏览器，并且灰显的滚动条在禁用时并非全部可见。

DEMO 2 可能不太有利，因为与上述选项不同，永远不会禁用的滚动条似乎总是表示可滚动的内容，即使内容不是。

使用JavaScript解决方案可能会偏离正轨，但也会更加沉重，维护/更新可能会更加繁琐。

手风琴在单击时弹回左侧

2 个答案:

调整溢出

调整高度