#概要
Youtubeとかでデフォルトのとは違うボタンでファイル選択ダイアログが開く。
あれ良いなーと思って見てみたら、かなり簡単だった。
#サンプル
完成品(Plunker)
#説明
input type="file"って全域にクリック判定があるので、見せたいサイズにしたらopacity:0で透明にする。
そしたら、背景に自分の見せたいデザイン置けば完成。
もちろん背景側になるので、hoverとかはinput側で止まる。
なので、このサンプルでは親要素のhoverと表示要素(子要素)のクラスで見た目変えるようにしてある。
ここにドラッグ&ドロップ捕まえるようにしたりして、前の投稿と掛け合わせれば良い感じ。
More than 5 years have passed since last update.
Register as a new user and use Qiita more conveniently
- You get articles that match your needs
- You can efficiently read back useful information
- You can use dark theme