Comments 57
UFO just landed and posted this here
UFO just landed and posted this here
Можно версию более точно?
9.63 — floomby.ru/content/Dc6gVBRsMk/
и заодно,
10.001 — floomby.ru/content/G7Jd53cEsk/
9.63 — floomby.ru/content/Dc6gVBRsMk/
и заодно,
10.001 — floomby.ru/content/G7Jd53cEsk/
0
работает сафари4бета-виндовс
0
на сафари и фф работает.
фишка сама по себе интересная и работает гладенько, но есть у меня соображение, что такие вещи может быть стоит не форматировать, а оставлять дефолтные форматы браузеров, чтобы не смущать пользователей. ведь пользователь, желая подгрузить файл, ищет глазом привычный интерфейс для загрузки, а ему такую, хоть и козырную, но непривычную фишку предлагают. если б я с таким столкнулся, я бы в первый момент не понял, где файл подгружать, даже несмотря на всплывающую подсказку – просто за столько лет стандартного интерфейса загрузки глаз настолько привык к одному и тому же, что стормозил бы.
фишка сама по себе интересная и работает гладенько, но есть у меня соображение, что такие вещи может быть стоит не форматировать, а оставлять дефолтные форматы браузеров, чтобы не смущать пользователей. ведь пользователь, желая подгрузить файл, ищет глазом привычный интерфейс для загрузки, а ему такую, хоть и козырную, но непривычную фишку предлагают. если б я с таким столкнулся, я бы в первый момент не понял, где файл подгружать, даже несмотря на всплывающую подсказку – просто за столько лет стандартного интерфейса загрузки глаз настолько привык к одному и тому же, что стормозил бы.
+6
Нихьт:
Mozilla/5.0 (X11; U; Linux i686; ru; rv:1.9.0.5) Gecko/2008122011 Iceweasel/3.0.7 (Debian-3.0.7-1)
Mozilla/5.0 (X11; U; Linux i686; ru; rv:1.9.0.5) Gecko/2008122011 Iceweasel/3.0.7 (Debian-3.0.7-1)
0
Очень понравилось — «на мой взгляд» =)
А по теме — я за стандартные элементы. Только.
А по теме — я за стандартные элементы. Только.
+1
хотя бы сделали курсор одинаковый что ли. в фф слева текстовый, правее дефолтный.
идеологически плохая задумка, скверно выполненная
ссылки по теме
habrahabr.ru/blogs/webdev/22926/
habrahabr.ru/blogs/la_france/13704/
идеологически плохая задумка, скверно выполненная
ссылки по теме
habrahabr.ru/blogs/webdev/22926/
habrahabr.ru/blogs/la_france/13704/
0
С курсорами и прочими красивостями надо ещё поработать, я с вами согласен.
По поводу идеологии — можно подробнее? Про что вы?
Всё различие между тем, что показали вы, и тем, что показал я — это наличие поля, с адресов самого файла на вашей машине и полное отсутствие яваскрипта в вышеописанном варианте. Из-за последнего пункта, как мне кажется, способ имеет право на жизнь, пусть не везде и не всегда его можно применять.
Кстати, по второй ссылке в комментариях увидел примерно то, о чём я писал. Ну это было очевидно, что я не Америку открыл.
По поводу идеологии — можно подробнее? Про что вы?
Всё различие между тем, что показали вы, и тем, что показал я — это наличие поля, с адресов самого файла на вашей машине и полное отсутствие яваскрипта в вышеописанном варианте. Из-за последнего пункта, как мне кажется, способ имеет право на жизнь, пусть не везде и не всегда его можно применять.
Кстати, по второй ссылке в комментариях увидел примерно то, о чём я писал. Ну это было очевидно, что я не Америку открыл.
-1
Неясно, зачем это надо делать. Имя файла не видно, превью картинки тоже просто так не сделать. Крайне неудобно для пользователя. В качестве лабораторного примера сойдет, но на хабр-то это зачем?
Если добавлять яваскриптовые или средства сюда, то получится снова не то: автор говорит исключительно про вариант с версткой. С предыдущим «оратором» согласен. Сделано не айс
Если добавлять яваскриптовые или средства сюда, то получится снова не то: автор говорит исключительно про вариант с версткой. С предыдущим «оратором» согласен. Сделано не айс
0
соглашусь — отсутствие js явный плюс!
идеология в том, что это как минимум должна быть кнопка (она ассоциируется с действием). то есть хотя бы вместо дива label или inpu type=button/image или а, соответсующе оформленные. title немного спасает положение, помогая пользователю понять, что он может совершить какое то действие
идеология в том, что это как минимум должна быть кнопка (она ассоциируется с действием). то есть хотя бы вместо дива label или inpu type=button/image или а, соответсующе оформленные. title немного спасает положение, помогая пользователю понять, что он может совершить какое то действие
+3
Можно навести красоту, к примеру, написав на самой картинке — «выбрать файл», сделать заголовок текстом над картинкой, поместив его в label. Способов показать пользователю, что при нажатии будет такой-то экшен довольно много (правда к стандартному виду файл инпута вообще не надо пояснений — но речь не об этом).
Это же просто пример (пример именно того кода, что находится в топике) — не относитесь к нему серьёзно — это незаконченный продукт, а сырая болванка.
Возможно его и правду не надо было выкладывать на Хабр.
Это же просто пример (пример именно того кода, что находится в топике) — не относитесь к нему серьёзно — это незаконченный продукт, а сырая болванка.
Возможно его и правду не надо было выкладывать на Хабр.
0
Напишите плз как можно на flash сделать множественный выбор файлов (через ctrl) в окне выбора.
-2
можно использовать готовый аплоадер на флеше, demo.swfupload.org
очень гибко настраивается и довольно неплохо работает.
очень гибко настраивается и довольно неплохо работает.
0
прикольно. У меня в левом нижем углу относительно блока в FF3 моргает курсорчик. Маленький такой, пикселя 2.
0
vremenno.net/design/file-inputs-styling/
+3
margin-left:-450px; — это что бы на саму кнопку попасть???
а если вместо отступа просто float:right; для инпута сделать
а если вместо отступа просто float:right; для инпута сделать
0
+2
Раз уж темя про инпуты — у оперы есть замечательные типы инпута type=«url» и type=«email».
0
Этому способу уже сто лет, но знают его и пользуют действительно единицы.
Первый раз я его увидил на Новом интерфейсе Яху-почты, только там они для скрытия input используют более корректную технику — css2:clip;
Первый раз я его увидил на Новом интерфейсе Яху-почты, только там они для скрытия input используют более корректную технику — css2:clip;
0
Браузер FF2, в приведенном вами демо: активная область (там где воспринимается клик) смещена примерно 15px вправо, то есть левая часть кнопки не реагирует на клики (курсор попадает в file-name-field).
Спасет direction: rtl
В целом решение считаю вполне изящным, спасибо. До сих пор пользовался техникой движения инпута под курсором, теперь перейду на ваш метод :)
Спасет direction: rtl
В целом решение считаю вполне изящным, спасибо. До сих пор пользовался техникой движения инпута под курсором, теперь перейду на ваш метод :)
0
UFO just landed and posted this here
Когда-то давно делал почти так же
gorinich.net/posts/8
gorinich.net/posts/8
0
По поводу невозможности вставить адрес файла через копи-паст, то есть обходной манёвр. Уже в самом диалоге выбора файла можно запросто вставлять полный путь файла и смело жать «Открыть».
0
В варианте Вашего друга у меня диалог выбора файла открывается только по двойному клику.
IE8 + GreenBrowser.
IE8 + GreenBrowser.
0
встретил бы просто так, не знаю что где-то тут кнопка загрузки — никогда бы не нажал. воспринимается как картинка и взгляд не цепляется, как за инпут.
0
Чувак, че-то в сафари 4(10.5.6) не очень. Т.е. работает только верхняя часть. А большая часть картинки не хочет.
0
Как-то слишком много ненужных свойств для инпута прописано.
Вполне достаточно:
На самом деле margin лишний, но мало ли он нужен в каких-то старых браузерах.
Вполне достаточно:
input {
display: block;
width: 100%;
height: 100%;
margin: 0;
opacity: 0;
}
На самом деле margin лишний, но мало ли он нужен в каких-то старых браузерах.
0
Sign up to leave a comment.
Кастомизация input type=”file” с помощью CSS