JavaScriptに色を反映する

今回は友達から、

「JavaScriptで色を指定して、RGBで値をとりたいんだけど…」

と言われたので簡単にサンプルコードを書きました。

 

サンプルコード

 

解説

JavaScriptというかHTMLというか…って感じのコードです。

inputタグのrangeタイプを使用してスライダーにて0~255の値を指定できるようにしました。

oninput属性を使用することで、スライダー操作時にJavaScript関数が実行されます。RGBの値はそれぞれJavaScriptの変数内に格納されるため、後は利用方法に合わせてお使いください(勿論value扱いなのでPHPにPOST等で投げるのもよし!)

特に難しい処理も挟んでいないのでRGB値を使用したい初心者の方にはお勧めです。友人はObnizにRGB値を送信してLEDの色を変更したいそうです。

 

おまけ

UIがちょっとリッチなバージョンもおまけに。

リッチではあるけどあまり使いやすいとは思わなかったし、自由度が利かない気がしたのでひとまず作ってみただけのコードです。雑ですが参考までに…

 

今回のブログ曲

今回投稿中に聴いていた曲はこちら

カテゴリー: HTMLJavaScript

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です