でスクロールバーを常に表示する方法に関する前の質問(<textarea>にスクロールバーを追加)に続いて、テキストがオーバーフローした場合でも<textarea>
、<textarea>
にスクロールバーがないように設定する方法を考えています。これで下にスクロールするには、矢印キーまたはマウスを使用してテキスト内を移動します。
これどうやってするの?
でスクロールバーを常に表示する方法に関する前の質問(<textarea>にスクロールバーを追加)に続いて、テキストがオーバーフローした場合でも<textarea>
、<textarea>
にスクロールバーがないように設定する方法を考えています。これで下にスクロールするには、矢印キーまたはマウスを使用してテキスト内を移動します。
これどうやってするの?
回答:
次のことを試してください。すべてのブラウザまたは使用しているブラウザでどちらが機能するかはわかりませんが、すべてを試すのが最善です。
<textarea style="overflow:auto"></textarea>
または
<textarea style="overflow:hidden"></textarea>
...上記のように
これを追加してみることもできます。これまで使用したことはなく、今日サイトに投稿されたのを見ただけです。
<textarea style="resize:none"></textarea>
この最後のオプションは、のサイズを変更する機能を削除しますtextarea
。CSSresize
プロパティの詳細については、こちらをご覧ください
MS IE 10の場合、おそらく次のことを行う必要があります。
-ms-overflow-style: none
以下を参照してください。
https://msdn.microsoft.com/en-us/library/hh771902(v=vs.85).aspx
たとえば:のクラスをscroll
textareaタグに指定します。そして、cssにこのプロパティを追加します-
スクロール部分を逃さずに動作しました
スクロールバーを非表示にしますが、CSSを使用してスクロールすることはできます
スクロールバーを非表示にするには、主要なブラウザ(Google Chrome、Safari、または新しいバージョンのOpera)でサポートされているため、-webkit-を使用します。以下にリストされている他のブラウザには、他にも多くのオプションがあります。
-webkit- (Chrome, Safari, newer versions of Opera):
.element::-webkit-scrollbar { width: 0 !important }
-moz- (Firefox):
.element { overflow: -moz-scrollbars-none; }
-ms- (Internet Explorer +10):
.element { -ms-overflow-style: none; }
参照:https://www.geeksforgeeks.org/hide-scroll-bar-but-while-still-being-able-to-scroll-using-css/
クラスのmax-height属性を削除することで、テキスト本文のスクロールバーを取り除くことができました。
Mozillaのスクロールバーを非表示にします。
overflow: -moz-hidden-unscrollable;
<textarea style="overflow:hidden"></textarea>
か?