Question

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

问题是，当我激活标签时，它会向下滑动，因为它的高度设置正确，但是当完成向下滑动的效果时，标签的高度设置为1px。下面你可以看到我正在使用的代码。

HTML code：

<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},
});

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

Answer 1

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

我希望它有所帮助。

jQuery UI标签通过heightStyle得到错误的高度：如果表在里面，则为“content”

1 个答案: