ホームページ > ウェブフロントエンド > jsチュートリアル > JS を使用してカラー 10 進数を rgba 形式に変換する方法の詳細なチュートリアル

JS を使用してカラー 10 進数を rgba 形式に変換する方法の詳細なチュートリアル

巴扎黑
リリース: 2017-09-05 09:39:49
オリジナル
1868 人が閲覧しました

この記事では主に、色の数値変換のための JavaScript の関連操作スキルを含む、JS で色の数値変換を実現する方法を紹介します。この記事の例は 10 を示しています。カラーを実現するJSのdigitメソッド 16進数をrgba形式に変換するメソッド。参考のために皆さんと共有してください。詳細は次のとおりです。

(0~256x256x256x256 の色の値) などの整数がわかっていて、その 3 原色と透明度、つまりアルファを取得したい場合、赤、緑、青、次のメソッドを使用できます:

方法 1:

function getColor(number) {
  let color = number;
  const blue = parseInt(color % 0x100, 10);
  color = color >>> 8;
  const green = parseInt(color % 0x100, 10);
  color = color >>> 8;
  const red = parseInt(color % 0x100, 10);
  const alpha = (parseInt(color >>> 8, 10) / 0xFF).toFixed(1);
  return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
}
ログイン後にコピー

方法 2:

function getColor(number) {
  const alpha = number >> 24 & 0xff;
  const red = number >> 16 & 0xff;
  const green = number >> 8 & 0xff;
  const blue = number & 0xff;
  return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
}
ログイン後にコピー

以上がJS を使用してカラー 10 進数を rgba 形式に変換する方法の詳細なチュートリアルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート