0

我最近开始使用 JQuery UI 选项卡，我想在选项卡中放置一个表格。选项卡应该尽可能小，所以我希望它的高度与内部表格的高度相关，所以我使用 heightStyle:"content"。

问题是，当我激活选项卡时，它像高度设置正确一样向下滑动，但是当向下滑动的效果完成时，选项卡的高度设置为 1px。您可以在下面看到我正在使用的代码。

HTML 代码：

<div id="tab_layer" class="tab_layer_l">
    <ul>
        <li><a href="#content_tab_layer">tab1</a></li>
    </ul>
    <div id="content_tab_layer" class="ui-widget">
        <table border=1 cellspacing=0 cellpadding=5 align=left>
            <tr>
                <td width=50%>...</td>
                <td width=50%>...</td>
            </tr>
            <tr>
                <td width=29%><input type="text" value="" /></td>
                <td width=29%><input type="text" value="" /></td>
            </tr>
            <tr>
                <td width=29%><input type="text" value="" /></td>
                <td width=29%><input type="text" value="" /></td>
            </tr>
            <tr>
                <td width=29%><input type="text" value="" /></td>
                <td width=29%><input type="text" value="" /></td>
            </tr>
        </table>
    </div>

javascript文件中的代码：

$('#tab_layer').tabs({
    active: false,
    collapsible: true,
    event: "mousedown touchstart",
    heightStyle: "content",
    hide: {effect: "slideUp", duration: 500},
    show: {effect: "slideDown", duration: 500},
});

如果有人可以帮助我，我会很高兴，我在互联网上搜索了很多，但似乎没有其他人有这个问题:(

4

1 回答 1

0

由于某种原因，我没有得到幻灯片效果，但我注意到桌子不合适。一旦我删除了表格对齐属性，布局就会正确显示。

我希望它有所帮助。

于 2013-02-19T10:48:58.253 回答