スマホでフォームの画像アップロード部分でカメラを起動させる方法
2024/04/16
formの画像アップロード部分で、スマホの場合にカメラで撮影させたい。以下に対応方法をメモ。
capture属性
https://developer.mozilla.org/ja/docs/Web/HTML/Attributes/capture
ソースコード
<!--カメラ直接起動--> <input type="file" accept="image/*;capture=camera"> <!--カメラやギャラリーの選択--> <input type="file">
尚、iphoneに関してはどっちのパターンでもカメラやギャラリーを選択するダイアログみたいなのが出てきた。
関連記事
-
-
ajaxを使わずに非同期っぽくsubmitする
ajaxを使わずに見た目はページ遷移せず、 画像を含めたformをsubmitし ...
-
-
FileReader APIを用いて画像をアップロードせずにサムネイル表示
以前にFile APIを用いてファイル名やサイズ、形式(拡張子)を取得するメモを ...
-
-
ブラウザがWebP対応の場合はそのまま表示し、非対応の場合はjpg/png画像を表示させる方法
ページ表示時にブラウザがWebP画像に対応している場合はそのまま表示し、非対応の ...
-
-
lazyload.js等のライブラリを使わずHTMLのみで画像の遅延読み込みを行う方法
画像を遅延読み込みさせるとなるとだいぶ前に書いたlazyload.jsを用いる方 ...
-
-
formのinput="file"でディレクトリを選択させ、ディレクトリ内のファイルを全てアップロードする方法
フォームで複数のファイルをアップロードしたい場合、input="file"を複数 ...