フォームでカラーコードを入力したい際にプラグイン無しでピッカー機能を搭載する方法
2024/02/20
あるフォームの項目でカラーコードを入力したいというケースがあった。だいぶ前に同じようなケースがあった際はjQueryのカラーピッカープラグインを使用していたが、今はHTML5で簡単に対応できるみたい。以下に方法をメモ。
使用方法
カラーコードのフォーム部分に以下を追記する。
<input type="color">
サンプル
https://taitan916.info/sample/color/
注意点
iPhoneのsafariで見たところ対応しておらず、テキストボックスの形で表示された。スマホも対応したい場合は以前に記事を書いた方法を用いる。
関連記事
-
-
HTMLでContent Security Policyの設定方法
Content Security Policyの設定をする事があった。Conte ...
-
-
lazyload.js等のライブラリを使わずHTMLのみで画像の遅延読み込みを行う方法
画像を遅延読み込みさせるとなるとだいぶ前に書いたlazyload.jsを用いる方 ...
-
-
form送信後にURLにアンカータグ(ハッシュタグ)をつける方法
フォームからGETもしくはPOSTで送信し、その後のURLにアンカータグ(ハッシ ...
-
-
mp3ファイルのアップロードと再生方法
mp3ファイルをformでアップロードしたかったのと、Webサイト上で再生したか ...
-
-
ブラウザがWebP対応の場合はそのまま表示し、非対応の場合はjpg/png画像を表示させる方法
ページ表示時にブラウザがWebP画像に対応している場合はそのまま表示し、非対応の ...