検索
ホームページウェブフロントエンドCSSチュートリアルJavaScript を使用してベンダー プレフィックスを CSS プロパティに効率的に適用するにはどうすればよいですか?

How Can I Efficiently Apply Vendor Prefixes to CSS Properties with JavaScript?

JavaScript を使用したベンダー プレフィックス付き CSS の設定

ベンダー プレフィックスを CSS プロパティに手動で適用するのは面倒な場合があります。提供されているコード スニペットは、transform プロパティのこのプロセスを示しています:

var transform = 'translate3d(0,0,0)';
elem.style.webkitTransform = transform;
elem.style.mozTransform = transform;
elem.style.msTransform = transform;
elem.style.oTransform = transform;

これを達成するより効率的な方法はありますか (JavaScript の 1 行で可能ですか?

Solution

このタスクを実行する既知のライブラリはありませんが、ベンダー プレフィックスの構文と名前が一貫しているため、カスタム関数の作成は簡単です。

function setVendor(element, property, value) {
  element.style["webkit" + property] = value;
  element.style["moz" + property] = value;
  element.style["ms" + property] = value;
  element.style["o" + property] = value;
}
この関数は次のことができます。次に、ベンダープレフィックス付きプロパティの設定に使用されます:

以上がJavaScript を使用してベンダー プレフィックスを CSS プロパティに効率的に適用するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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

Wufooは常に統合に優れています。キャンペーンモニター、MailChimp、TypeKitなどの特定のアプリと統合されていますが、

ジャムスタックの風景ジャムスタックの風景Apr 13, 2025 am 11:00 AM

NetlifyがJamstackという用語を発明したという大きな秘密ではありません。 Netlifyを使用せずにJamstackを受け入れることは可能ですが、Netlifyが

.htmの代わりに.htmlを使用するのはなぜですか?.htmの代わりに.htmlを使用するのはなぜですか?Apr 13, 2025 am 10:59 AM

アンディからの興味深い質問:

私の開発者のクリップ私の開発者のクリップApr 13, 2025 am 10:55 AM

私は最近、DEVでAMAをやりました。ここでは、良いインディエバーのようにいくつかの答えを渡す機会を得るだけです。

いくつのウェブサイトを構築する必要がありますか?いくつのウェブサイトを構築する必要がありますか?Apr 13, 2025 am 10:42 AM

誰かが私に電子メールを送った:

ギャツビーとワードプレスギャツビーとワードプレスApr 13, 2025 am 10:39 AM

ギャツビーとワードプレスは、見るべき興味深いコンボです。一方では、それは完全に理にかなっています。ギャツビーはどこからでもデータを吸うことができ、ワードプレスは

ギャツビーで現在のページURLを取得する方法ギャツビーで現在のページURLを取得する方法Apr 13, 2025 am 10:37 AM

この一見簡単なタスクでは、ウェブサイトで作業している間、数時間頭を掻きました。結局のところ、現在のページURLを取得する

2019年にWeb開発者(および人)としてどのように改善されたか2019年にWeb開発者(および人)としてどのように改善されたかApr 13, 2025 am 10:35 AM

私たちは21世紀の20代のro音に滑り込んでいます(キュージャズミュージック?)。あなたと私は、責任者として、従うことが重要です

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

MantisBT

MantisBT

Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティング サービスをチェックしてください。

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser は、オンライン試験を安全に受験するための安全なブラウザ環境です。このソフトウェアは、あらゆるコンピュータを安全なワークステーションに変えます。あらゆるユーティリティへのアクセスを制御し、学生が無許可のリソースを使用するのを防ぎます。

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Dreamweaver Mac版

Dreamweaver Mac版

ビジュアル Web 開発ツール