- ベストアンサー
[html] <input type="file">タグの参照ボタンを画像ボタンにしたい。
タイトルのとおりなんですが、<input type="file">をhtmlで記述するとテキストボックスと共に参照ボタンが表示されますよね？ あの参照ボタンを画像ボタンにしたいのですが、どうしたらできるのでしょうか？それともそもそも出来ないのでしょうか？ 教えてください。お願いします。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
見た目は、これでごまかせます。 機能的にも問題ないです。 > background-image :url(./image.gif); の「./image.gif」の部分に、自分が表示したい画像のpathを指定 <html> <head> <style> .fake_button { width : 10px; height : 23px; background-image :url(./image.gif); background-repeat : no-repeat; cursor : hand; } </style> <script> function view_path(_value){ document.all.txtfilename.value=_value; } </script> </head> <body> <input type="file" name="uploadFile" style="display:none" onchange="view_path(this.value);"> <input type="text" name="txtfilename" size="25" disabled> <span onclick="filupload.click();" class="fake_button"> </body> </html>
その他の回答 (1)
- steel_gray
- ベストアンサー率66% (1052/1578)
HTMLだけでは無理です。 CSSやjavascriptを活用して、画像のクリックを参照ボタンに結びつけるような事は不完全ながら可能です。→参考URL
お礼
steel_grayさん、ありがとうございます。 大変参考になりました。
お礼
kappa_nekoさん、ありがとうございます。 一応Kappa_nekoさんの方法を参考にやることができました。 ただ、ちがった問題がどうやら発生したようです。 新しい質問として投稿させていただきます