0

大規模なデータセットのUIを構築します。理想的なのは、200行以上のデータに対応するためにスクロール可能な固定の高さのテーブルを用意することです。ボーナスは、JQuery UIを使用して、ユーザーがテーブルの高さをドラッグして行を増減できるようにすることです。

私がこれまでに持っているもののJSFiddle：http: //jsfiddle.net/jonbrownm/j5cdx/

HTML

<div>
<table>
    <tbody>
        <tr>
            <td>Clementine</td>
            <td>Bradford</td>
            <td>neque@in.org</td>
        </tr>
        ...
    </tbody>
</table>

JQUERY

$(function () {
  $("div").resizable({
    handles: "s"
  });
});

CSS

div {
  width:100%;
  height: 100px;
  overflow-y:auto;
  overflow-x:hidden;
}
div .ui-resizable-s {
  height: 20px;
  background: red;
  cursor: s-resize;
  border: solid 1px red;
  width: 100%;
  bottom: -5px;
  left: 0;
}

そこは50％です。テーブルのサイズを変更できますが、スクロールすると、スクロールテーブルでハンドルがドラッグされます。.ui-resizable-sdivに関連してabsoluteを設定しようとしましたが、うまくいきませんでした。

誰かがこれまたは適切な解決策に出くわしたことがありますか？

角括弧構文を使用する

Object first = array[0];
4

1 に答える 1

1

サイズ変更と同じdivにスクロールがあるためだと思います。サイズ変更可能な外側の div と、スクロールで高さ 100% の内側の div を試してみてください。次に、サイズ変更可能な div に対してハンドルを配置します。

これでうまくいくはずです。あなたの jsFiddle を試して、私の言いたいことがわかるようにします。

編集:フィドルを次のように更新しました: http://jsfiddle.net/j5cdx/4/

Why do I need to accompany my fiddle link with code stack overflow??
于 2013-03-07T12:07:20.950 に答える