概要
Youtubeとかでデフォルトのとは違うボタンでファイル選択ダイアログが開く。
あれ良いなーと思って見てみたら、かなり簡単だった。
サンプル
説明
input type="file"って全域にクリック判定があるので、見せたいサイズにしたらopacity:0で透明にする。
そしたら、背景に自分の見せたいデザイン置けば完成。
もちろん背景側になるので、hoverとかはinput側で止まる。
なので、このサンプルでは親要素のhoverと表示要素（子要素）のクラスで見た目変えるようにしてある。
ここにドラッグ＆ドロップ捕まえるようにしたりして、前の投稿と掛け合わせれば良い感じ。