ホームページ > 記事 > ウェブフロントエンド > JavaScript での iframe スクロール バーの削除と保持
開発中、すべてのスクロール バーを削除する、右側のスクロール バーを削除して下部のスクロール バーを保持する、下部のスクロール バーを削除して右側のスクロール バーを保持するという問題によく遭遇します。これを JS に基づいて実現するにはどうすればよいでしょうか。この記事では、JavaScript で iframe スクロール バーを削除および保持する方法を紹介します。見てみましょう!
iframe がページに埋め込まれた後、スクロール バーを調整する必要がある場合があります。たとえば、すべてのスクロール バーを削除する、右側のスクロール バーを削除して下部のスクロール バーを維持する、下部のスクロール バーを削除して右側のスクロール バーを維持するなどです。バー。だから何をすべきか?
1: すべてのスクロール バーを削除します
最初の方法: iframe には、auto、yes、no の 3 つの値を持つスクロール属性があります。スクロール: いいえ -------スクロール バーを常に非表示にします
スクロール: いいえを設定すると、すべてのスクロール バーが表示されなくなります。
スクロールに加えて、すべてのスクロール バーを削除できます。埋め込みページで body{overflow: hidden} を設定するという別の方法もあります。これにより、スクロール バーも削除できます。これも、削除したい場合のみ当てはまります。特定のスクロール バーで使用されるプロパティ。
2: 右側のスクロール バーを削除し、スクロール バーを下部に維持します
スクロール バーのみを下部に維持したい場合は、埋め込みページに body を設定できます。 -y: hidden;}
3: 下部のスクロール バーを削除し、右側にスクロール バーを残します
埋め込みページに body{overflow-x: hidden; overflow-y: auto;} を設定します
これらの属性はスクロール バーの表示と非表示の両方を設定できることはすでに知っていますが、両方を同時に設定すると、どちらの効果が発生しますか?
検出により、スクロール = 「自動」または「はい」の場合、本文が設定されている場合は、本文の設定が使用されます。スクロール = 「いいえ」の場合は、本文の設定に関係なく、スクロールすることがわかりました。使用される設定、つまりすべてのスクロール バーが削除されます。