色の操作：
各部の色を取得
対象Nodeの指定位置の色を取得して、HEX値かrgba値で返す。
また、通常の取得で得られる文字列には半角スペースが含まれるがこれも削除する。
Node
Nodeを指定 id値を文字列で指定してもよい
String
色を取得する部位を指定
- ○color, backgroundColor, borderTopColor など
- ※CSSの属性でハイフンがあるものはキャメルケースで指定 「border-color」→「borderColor」
- ○次の略語も使用可能
- tx = color
- bg = backgroundColor
- bc = borderColor
- bt = borderTopColor
- bb = borderBottomColor
- bl = borderLeftColor
- br = borderRightColor
●必須引数 ●オプション引数(省略可能)
記述例
$getColor(nodeArray[0], 'color')
$getColor('section_1', 'bg')
戻り値
○不透明の場合
・HEX値(6桁の16進数／「#」無し)を文字列で返す。
○透明度がある場合
・rgba値のコードを文字列で返す。
動作サンプル
各部の色を取得して出力する。
class="sample_minibox"
id="sample_1"
id="sample_1"
CSS :
.sample_minibox#sample_1 {
color: #fff;
background-color: rgba(142,184,189,0.8);
border: 4px solid #c6dbde;
}
Javascript :
var colorStr1=$getColor($getNodes('sample_minibox',0),'color');
var colorStr2=$getColor('sample_1','backgroundColor');
var colorStr3=$getColor('sample_1','bl');
※上記のサンプルコードは主にPC表示用を想定している。スマホ用のコーディングでは別途調整が必要となる可能性がある。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。
※この関数の動作サンプルとして必須ではない装飾的なCSSコードなどは省略して提示している。