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

なんらかの理由でスライド効果が得られませんが、テーブルのフィット感が悪いことに気付きました。table align プロパティを削除するとすぐに、レイアウトが正しく表示されました。

お役に立てば幸いです。

于 2013-02-19T10:48:58.253 に答える