Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Элемент формы для загрузки файла, в виде картинки, Browse – выбор файла при клике на фото 
:(
    Опции темы
nicka47
  Дата 5.10.2007, 21:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 200
Регистрация: 23.3.2005
Где: Грузия

Репутация: нет
Всего: нет



ПОставили задачу, создать форму для загрузки фото, но чтобы не обычный элемент  
Код
<input type="file" name="textfield" />

а чтобы на странице сидела просто изображение, при нажатии на которое открывается окно для выбора файла (Browse ).

ВОзможно ли такое вообще, и как именно smile 
PM MAIL   Вверх
cruelangel
Дата 5.10.2007, 21:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 319
Регистрация: 12.9.2007

Репутация: 4
Всего: 8



сделать инпут прозрачным и подложить под него картинку
PM MAIL   Вверх
nicka47
Дата 5.10.2007, 22:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 200
Регистрация: 23.3.2005
Где: Грузия

Репутация: нет
Всего: нет



если можно, подскажите команды для делания прозрачным и для подложки картинки именно в область инпута 

ПРозрачным  - это значит невидимым? style="visibility:hidden" ?
PM MAIL   Вверх
cruelangel
Дата 5.10.2007, 22:44 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 319
Регистрация: 12.9.2007

Репутация: 4
Всего: 8



нет, opacity:0 и фильтр для ИЕ с аналогичным действие.
PM MAIL   Вверх
nicka47
Дата 6.10.2007, 00:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 200
Регистрация: 23.3.2005
Где: Грузия

Репутация: нет
Всего: нет



а что такое фильтр для ИЕ ?

если не трудно поподробнее, не понимаю что делать smile 
PM MAIL   Вверх
Loengreen
Дата 6.10.2007, 02:12 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 42
Регистрация: 13.7.2007

Репутация: нет
Всего: нет



Код

<img src='button.gif' alt='' />
<input type="file" style="width: 0; opacity: 0; filter: alpha(opacity=0); -moz-opacity: 0; margin-top: -20px;">

Будет примерно так.

---
Указав ширину input 0, ты получишь минимальный input и кнопку. Задав прозрачность (код выше работает для IE, FF, Opera) 0, ты сделаешь стандартную кнопку при input-е невидимой. margin-ом или чем-либо другим накладываешь "невидимку" на изображение кнопки и все готово.

Задавать для img "cursor: pointer;" бесполезно - у кнопки input-a он все равно default... Хотя можно попробовать поменять курсор для input-a... но это вряд ли получится.


Это сообщение отредактировал(а) Loengreen - 6.10.2007, 02:13
PM MAIL   Вверх
Alix
Дата 6.10.2007, 09:19 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


L45
**


Профиль
Группа: Участник
Сообщений: 581
Регистрация: 4.5.2005
Где: Pskov/Spb

Репутация: нет
Всего: 23



Нет, img все равно ловил нажатие на себя, а не на input. У меня получилось добиться желаемого сделав картинку фоном. Я использовал div, но можно и td.
Код
<div style="background: url('/themes/officexp/imgs/note_c.gif') right top no-repeat; width: 200px;">
<input type="file" style="opacity: 0; filter: alpha(opacity=0); -moz-opacity: 0;">
</div>



--------------------
Знание только тогда знание, когда оно приобретено усилиями своей мысли, а не памятью (с) Л. Толстой
High tech. Low live. (с) Gardner Dozois
PM MAIL ICQ Skype   Вверх
nicka47
  Дата 8.10.2007, 15:58 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 200
Регистрация: 23.3.2005
Где: Грузия

Репутация: нет
Всего: нет



хорошо, но как сделать чтобы после того как файл выбран форма пошла на сабмит?
PM MAIL   Вверх
cruelangel
Дата 8.10.2007, 16:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 319
Регистрация: 12.9.2007

Репутация: 4
Всего: 8



под "подложить картинку" я и подразумевал "положить фоном" smile всё, что не относится к контенту страницы идеологически верно вставлять как фон.

> хорошо, но как сделать чтобы после того как файл выбран форма пошла на сабмит? 

у формы есть метод submit
PM MAIL   Вверх
nicka47
Дата 8.10.2007, 22:46 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 200
Регистрация: 23.3.2005
Где: Грузия

Репутация: нет
Всего: нет



cruelangel,  Знаю, но как сделать, чтобы при закрытии окна выбора файла сразу запустился сабмит? ведь я же не жму на кнопку , поскольку она невидима, и нажатие должно синсцинироваться сразу после выбора файла автоматом, но как?
PM MAIL   Вверх
Alix
Дата 8.10.2007, 22:55 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


L45
**


Профиль
Группа: Участник
Сообщений: 581
Регистрация: 4.5.2005
Где: Pskov/Spb

Репутация: нет
Всего: 23



На выбор: у input ловить onchange, быть может onclick или что там еще есть. Или, быть может, это и невозможно... Поле type=file оно такое... особое...


--------------------
Знание только тогда знание, когда оно приобретено усилиями своей мысли, а не памятью (с) Л. Толстой
High tech. Low live. (с) Gardner Dozois
PM MAIL ICQ Skype   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0514 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.