0

我有以下受 twitter bootstrap 启发的代码。它在除 Blackberry Curve 8200 之外的所有设备上都能完美运行。

基本上是打开和关闭导航。

事件正在触发，状态正在正确获取，但是当我调整 css 时没有任何反应:( 我尝试添加和删除类，同样的问题。

如果我也手动向折叠的元素添加样式属性，折叠的元素会正确显示。

$('[data-toggle="collapse"]').bind('click', collapse);

function collapse (e) {
    var $this = $(this);
    var target = $this.data('target');
    var state = $this.data('state');
    if ( ! state ) state = 'closed'; 

    if ( state === 'closed' ) {
        $(target).css('height', 'auto');
        $this.data('state', 'open');
    } else {
        $(target).css('height', '0');
        $this.data('state', 'closed');
    }
    return false;
}

基本上看起来像以下行

$(target).css('height', 'auto');

只是没有做任何事情。即使目标变量是正确的。

我的 html 基本上看起来像这样

<style>
    .nav { height: 0; }
</style>
<div data-toggle="collapse" data-target=".nav">...</div>
<div class="nav">...</div>

-更新-

我正在使用 zepto，刚刚尝试使用 jQuery ......同样的问题。

4

1 回答 1

1

这是OS5还是OS6？如果是 OS5，支持 DOM 重新渲染的浏览器存在各种缺陷。height: auto作为其中之一。我使用的解决方案是在页面加载时显示它们，测量然后通过data-*属性缓存它们的原始高度，然后将它们全部折叠。这样，当需要展示它们时，auto我可以给出精确的像素尺寸，而不是。

于 2012-06-11T14:28:54.817 回答