ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript での iframe スクロール バーの削除と保持

JavaScript での iframe スクロール バーの削除と保持

高洛峰
高洛峰オリジナル
2016-12-06 15:40:051490ブラウズ

開発中、すべてのスクロール バーを削除する、右側のスクロール バーを削除して下部のスクロール バーを保持する、下部のスクロール バーを削除して右側のスクロール バーを保持するという問題によく遭遇します。これを 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;} を設定します

これらの属性はスクロール バーの表示と非表示の両方を設定できることはすでに知っていますが、両方を同時に設定すると、どちらの効果が発生しますか?

検出により、スクロール = 「自動」または「はい」の場合、本文が設定されている場合は、本文の設定が使用されます。スクロール = 「いいえ」の場合は、本文の設定に関係なく、スクロールすることがわかりました。使用される設定、つまりすべてのスクロール バーが削除されます。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。