HOME > HTML > フォームでカラーコードを入力したい際にプラグイン無しでピッカー機能を搭載する方法

フォームでカラーコードを入力したい際にプラグイン無しでピッカー機能を搭載する方法

2019/01/11 2024/02/20 HTML

あるフォームの項目でカラーコードを入力したいというケースがあった。だいぶ前に同じようなケースがあった際はjQueryのカラーピッカープラグインを使用していたが、今はHTML5で簡単に対応できるみたい。以下に方法をメモ。

使用方法

カラーコードのフォーム部分に以下を追記する。

<input type="color">

iPhoneのsafariで見たところ対応しておらず、テキストボックスの形で表示された。スマホも対応したい場合は以前に記事を書いた方法を用いる。

: formのinput="file"でディレクトリを選択させ、ディレクトリ内のファイルを全てアップロードする方法

フォームで複数のファイルをアップロードしたい場合、input="file"を複数 ...

: HTML / CSSで作成したコンテンツをPDFファイルで出力する方法(TCPDF)

HTML / CSSで作成したコンテンツをPDFファイルで出力させたい。以前mp ...

: スマホでページ内リンクからGoogleMapアプリを開く

スマホでWebページにあるリンクをクリックした際にGoogleMapアプリを表示 ...

: ブラウザがWebP対応の場合はそのまま表示し、非対応の場合はjpg/png画像を表示させる方法

ページ表示時にブラウザがWebP画像に対応している場合はそのまま表示し、非対応の ...

: HTML内に動画(mp4ファイル)を埋め込んで配信する方法

Webページ内にYoutubeとかを用いずに動画(mp4)ファイルを配信したいと ...