2

画面から右に伸びるテーブルがあります（固定されており、この幅は画面の幅よりも大きくなっています）。ブラウザは、下部にスクロール バーを自動的に作成します。このテーブルを右側の「見えない」領域に表示しているときに、ブラウザにスクロールバーを作成しないように指示するにはどうすればよいですか? この演習の目的は、Javascript を使用してこのテーブルを左にスクロールし、最初は画面の外にある右側にコンテンツを表示することです。

「本文」に「overflow:hidden」を設定すると、他のすべてのコンテンツが画面に収まらない場合にスクロールできなくなります (たとえば、コンテンツが 1280 向けに最適化されているため、1024 ブラウザーでは)。ブラウザーのスクロールバーを作成しないために、このテーブル (2 つの DIV 内にある) だけが必要です...

コードは次のようになります

<div style="position:relative;overflow:hidden;width:1500px">
    <div style="float:left">
        <table style="table-layout:fixed;width:1500px">
            <tr>
                <td style="width:300px">
                    aaa
                </td>
                <td style="width:300px">
                    bbb
                </td>
                <td style="width:300px">
                    ccc
                </td>
                <td style="width:300px">
                    ddd
                </td>
                <td style="width:300px">
                    eee
                </td>
            </tr>
        </table>
    </div>
</div>
4

3 に答える 3

2

次の CSS ルールを追加します。

body
{
  overflow-x:hidden;
}

編集：あなたのコメントを見て、それtableが範囲内であることを確認した後、次のことをおdiv勧めします。あなたのマークアップが次のとおりだとしましょう：

<div class="tablecontainer">
  <table />
</div>

次の CSS ルールを使用します。

div.tablecontainer
{
  overflow-x:hidden;
}
于 2012-06-20T10:49:59.950 に答える
1

これを試して

<body style="overflow-x:hidden;">

または任意の CSS クラスを使用して、このプロパティを body タグに追加します。

于 2012-06-20T10:51:08.687 に答える