Comments 35
Скриншот бы хоть, в качестве КДПВ :)
Как-то маловато для статьи. И да, способ давно известный, в свой древней статье я его приводил)
Хм… использую Plupload, поддерживает клик, Drag'n'Drop.
Есть различные варианты в зависимости от того, что умеет браузер: HTML5, HTML4, Flash, Silverlight.
Я обычно беру только HTML5 вариант для минимизации объема, и даже iframe не нужен.
Есть различные варианты в зависимости от того, что умеет браузер: HTML5, HTML4, Flash, Silverlight.
Я обычно беру только HTML5 вариант для минимизации объема, и даже iframe не нужен.
Где можно «пощупать»?
Не проще input=file с прозрачностью в ноль расположить поверх дива, который и стилизовать?
Проще конечно.
Но мы же не ищем лёгких путей, тем более в статье ссылка есть на статью с этим примером (Способ №3), но автор сказал, что лучше рассмотреть N5
Единственное — в статье нет этого способа (вроде):
Но мы же не ищем лёгких путей, тем более в статье ссылка есть на статью с этим примером (Способ №3), но автор сказал, что лучше рассмотреть N5
На написание данного текста вдохновил Способ №5 из материала «Делаем красивый input[type=file] для адаптивного сайта…»
Единственное — в статье нет этого способа (вроде):
input[type=file] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
/** А дальше пишем что хотим **/
}
Можете бросить в меня камнем, но кажется только вчера прочел, что нормальные браузеры запрещают из js вызывать клик на input[type=file]. Пруф
Пример нормального браузера?
FF, Chome, НЕ IE.
Кстати, в каком из… вы тестировали?
Кстати, в каком из… вы тестировали?
Да? А почему у меня работало и работает?
отлично, тогда можно демку в студию?
Кстати только что проверил в консоли хрома. Не работает. Увы…
Взял кусочек вашего кода…
Может я что-то не так сделал?
Взял кусочек вашего кода…
Может я что-то не так сделал?
Моего кода?
да, вот так
document.getElementById('my_hidden_file').click();
Я не автор статьи
Еще раз все протестировал, тьфу тьфу работает…
можно глянуть в мою dyukha.rurs.net/MySlider
песочницу на бесплатном(плохом) хостинге
снизу вторая справа кнопка
можно глянуть в мою dyukha.rurs.net/MySlider
песочницу на бесплатном(плохом) хостинге
снизу вторая справа кнопка
а я замечал обратное, когда пытался инпут стилизовать (давно это было):
ие8 не давал делать клик js, а нормальные браузеры давали.
в итоге прозрачность — самое нормальное решение
если кнопка большая, можно сделать, чтобы input ездил за курсором, т.к. размеры его тоже нельзя поправить в некоторых браузерах :)
ие8 не давал делать клик js, а нормальные браузеры давали.
в итоге прозрачность — самое нормальное решение
если кнопка большая, можно сделать, чтобы input ездил за курсором, т.к. размеры его тоже нельзя поправить в некоторых браузерах :)
> запрещают из js вызывать клик на input[type=file]
кроме случаев, когда вызов делается внутри обработчика события клика нам чем-либо еще. Может быть не только клика (keydown, например), точно не знаю.
кроме случаев, когда вызов делается внутри обработчика события клика нам чем-либо еще. Может быть не только клика (keydown, например), точно не знаю.
У нас на проекте angular.element('#file-upload').trigger('click') запросто работает.Ну т.е. есть некоторый кастомный блок (кнопка), по клику на который вызываем клик на инпут #file-upload.
Думаю, пост был бы в несколько раз полезнее, если бы имел демку.
Извиняюсь если что сделал не так, человек я тут новый, за что заминусовали не понимаю (.
Демку добавил — в тексте перед Целью ссылка на дропбокс, там весь проект — проверял на IE9+, Opera 12.17, FF 34.05, Yandex 14.10, Chrome 39.0, Chrome Android (какой то 4+ — не успел посмотреть какая там версия была)
Демку добавил — в тексте перед Целью ссылка на дропбокс, там весь проект — проверял на IE9+, Opera 12.17, FF 34.05, Yandex 14.10, Chrome 39.0, Chrome Android (какой то 4+ — не успел посмотреть какая там версия была)
Вот хорошая подборка на эту тему.
obninsksite.ru/blog/html-and-css/input-file-style
obninsksite.ru/blog/html-and-css/input-file-style
Sign up to leave a comment.
Полностью своя кнопка «Выбрать файл»