1. ホーム
  2. html

[解決済み] 垂直スクロールバーを不要なときに隠す方法

2022-12-21 03:28:44

質問

私はjquery hintを持っているので、divに含まれているtextareaを持っており、ボーダーを変更することなく不透明度を使用したかった。 目に見える垂直スクロールバーがありますが、私はテキストフィールドに入力しているときだけこれを表示したいのですが、それはコンテナを超えています。私はoverflowを試してみました:auto;しかし、動作しません。

テキストフィールド。

<label>
    <div id="name">
        <textarea name="message" type="text" id="message"
            title="Enter Message Here"
            rows=9 cols=60 maxlength="2000"></textarea>
    </div>
</label>

スタイル

#name { 
    border: 1px solid #c810ca;
    width: 270px;
    height:159px;
    overflow: hidden; 
    position: relative;
    }

#message {
    height: 400px;
    width: 235px;
    overflow: hidden;
    position: absolute;
}

どのように解決するのですか?

overflow: auto (または overflow-y: auto ) が正しい方法です。

問題は、テキストエリアの高さが div よりも高いことです。 div は結局テキストボックスを切り離してしまうので、テキストの高さが 159px よりも高い位置にあるまでスクロールが開始されません。 400px これはテキストボックスの高さです。

これを試してみてください。 http://jsfiddle.net/G9rfq/1/

テキストボックスにoverflow:autoを設定し、テキストボックスをdivと同じサイズにしました。

また、私は、このように div の中に label の中にある場合、ブラウザはそれをレンダリングしますが、おかしなことが起こるかもしれません。 また div は閉じられていません。