Убираем бредовые стандартные инпуты и делаем во всех браузерах один свой стилизованный input.
1. Берем стандартную кнопку из браузера Mozilla.
2. В Photoshop’е добиваемся примерно этого:

3. Следующим этапом оформляем код примерно такого содержания.
CSS:
.file_1 { background: #fff; color: #888; }
div.filestyle{ background:url(choose-file.png) 0 0 no-repeat;}
div.filestyle:hover{ background:url(choose-file.png) 0 -25px no-repeat; }
Javascrip:
$(function() {
$("input.file_1").filestyle({
image: "choose-file.png",
imageheight : 25, /*высота обзора*/
imagewidth : 73, /*ширина обзора*/
width : 500 /*ширина текстового поля*/
});
});
И конечно небольшая часть html кода:
< form action="#">
< input type="file" class="file_1" />
< /form>
Собственно все, получаем на выходе стилизованный инпут.
К документу цепляем 2 файла, версии на момент выхода статьи
jquery-1.4.2.min
jquery.filestyle




Вконтакте
FaceBook
WordPress