フォームでカラーコードを入力したい際にプラグイン無しでピッカー機能を搭載する方法
2024/02/20
あるフォームの項目でカラーコードを入力したいというケースがあった。だいぶ前に同じようなケースがあった際はjQueryのカラーピッカープラグインを使用していたが、今はHTML5で簡単に対応できるみたい。以下に方法をメモ。
使用方法
カラーコードのフォーム部分に以下を追記する。
<input type="color">
サンプル
https://taitan916.info/sample/color/
注意点
iPhoneのsafariで見たところ対応しておらず、テキストボックスの形で表示された。スマホも対応したい場合は以前に記事を書いた方法を用いる。
関連記事
-
-
HTMLのimgタグでブラウザ幅によって異なる画像を表示する方法
あるサイトのコーディングデータを貰った際に1つのimgタグに対して複数の画像が指 ...
-
-
FileReader APIを用いて画像をアップロードせずにサムネイル表示
以前にFile APIを用いてファイル名やサイズ、形式(拡張子)を取得するメモを ...
-
-
HTMLにてaタグクリック時にping属性のデータをPHPで受け取る方法
HTMLのaタグにping属性というものを設定できるらしく、設定したリンクをクリ ...
-
-
フォームのテキストボックスでブラウザによる自動補完を無効にする方法
あるformのテキストフィールド(input="text")でブラウザによる自動 ...
-
-
lazyload.js等のライブラリを使わずHTMLのみで画像の遅延読み込みを行う方法
画像を遅延読み込みさせるとなるとだいぶ前に書いたlazyload.jsを用いる方 ...