▶ 実 行
▶ 実行
クリア
グラデーションのテスト
by 雪乃☆雫
!「https://n3s.nadesi.com/plain/ImageProcessing.nako3」を取り込む。 # UI作成 DOM親要素に「<div id="UI1"></div><div id="mihon1"></div><div id="UI2"></div><div id="mihon2"></div>」をHTML設定。 「#UI1」にDOM親要素設定。 「色1:」のラベル作成。「#99AAFF」のエディタ作成して、色1エディタへ代入。改行作成。 「色2:」のラベル作成。「#99FFAA」のエディタ作成して、色2エディタへ代入。改行作成。 「等比グラデーション」のボタン作成して、ボタン1に代入。 「#UI2」にDOM親要素設定。 改行作成。改行作成。 「元色:」のラベル作成。「#FFAA99」のエディタ作成して、元色エディタへ代入。改行作成。 「等差グラデーション」のボタン作成して、ボタン2に代入。 #----------------------------------------------- ●等比グラデーション作成 色見本=空。色1=色1エディタのテキスト取得。色2=色2エディタのテキスト取得。 11回 背景色=10*(回数-1)で色1と色2の色等比計算のカラーコード16を大文字変換。 色見本=「<div style="background-color:{背景色}">{背景色}</div>」を色見本に一行追加。 ここまで。 「#mihon1」に色見本をHTML設定。 ここまで。 //元色のMaxがFFかつMinが00の時は全部同じ色になってグラデーションにならない(#FF00CCとか) ●等差グラデーション作成 色見本=空。元色=元色エディタのテキスト取得。 11回 背景色=10*(回数-1)で元色の色等差計算のカラーコード16を大文字変換。 色見本=「<div style="background-color:{背景色}">{背景色}</div>」を色見本に一行追加。 ここまで。 「#mihon2」に色見本をHTML設定。 ここまで。 等比グラデーション作成。 等差グラデーション作成。 #----------------------------------------------- # スタイル設定 色1エディタの「幅」に「80px」をDOMスタイル設定。 色2エディタの「幅」に「80px」をDOMスタイル設定。 元色エディタの「幅」に「80px」をDOMスタイル設定。 # イベント設定 ボタン1をクリックした時には、 等比グラデーション作成。 ここまで。 ボタン2をクリックした時には、 等差グラデーション作成。 ここまで。