jQuery を使用して古いブラウザで「width: calc(100% - 100px)」機能を実現するにはどうすればよいですか?

jQuery を使用した「width: calc(100% -100px)」の代替

「width: calc(100% -100px)」 " CSS ルールは、オブジェクトの全幅から 100 ピクセルを効率的に減算します。ただし、Safari ではなく最新のブラウザでのみサポートされているため、互換性の問題に直面しています。

jQuery の代替手段

この制限に対処するには、jQuery を使用できます。次の jQuery コードでも同様の効果が得られます。

$('#yourEl').css('width', '100%').css('width', '-=100px');

このコードは、オブジェクトの幅を 100% から 100px 引いたものとして動的に計算し、それを CSS 幅として設定します。

利点jQuery メソッドの

• 使いやすさ: jQuery は複雑な計算を簡略化し、必要な機能の実装を容易にします。
• 互換性: jQuery はブラウザ間で広くサポートされており、「calc」式をサポートしていない古いブラウザとの互換性が確保されています。

以上がjQuery を使用して古いブラウザで「width: calc(100% - 100px)」機能を実現するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。